Category: javascript

First off, this seems like a very simple question, but, the solutions I’ve found so far haven’t worked, they are mostly suggesting using jQuery, but, as I’m using Bootstrap 5, they have moved away from jQuery, so I’m hoping not to use that in favour of JavaScript if possible, or even just HTML if that is a thing.

Basically, my issue is that I have an input field in an off-canvas settings area. When a user types anything in that field, I want that number to then appear on the body of the HTML in the form of another text field or something. This could happen either as they are typing, updating per key-press or with a submit button, either would work fine. I have included a screenshot to better explain what I mean:

I have artificially added the Text Here on the left to help give a visual on what I would like to achieve, at the moment entering the text in the Centre ID No. field does nothing.

If anybody can point me in the right direction, it would be greatly appreciated.

Cheers.

I am trying to make the login do the function when the response is success, but for some reason it does not log the response but still logins into the site after you F5 and refresh it. Any help is appreciated as I am not good at this at all!

$(function() {
    var action = "";
    var form_data = "";
    $("#login").click(function() {
        $("#username").prop("disabled", true);
        $("#password").prop("disabled", true);
        action = $("#loginform").attr("action");
        form_data = {
            username: $("#username").val(),
            password: $("#password").val(),
        };
        $("#login").keypress(function(e) {
            if (e.which == 13) {
                //Enter key pressed
                $("#login").click();
            }
        });
        $.ajax({
            type: "POST",
            url: "?base=misc&script=login",
            data: form_data,
            dataType: "json",
            success: function(response) {
                if (response.status) {
                    $("#loginform").slideUp("slow", function () {
                        $("#message").html(
                            '<script>location.reload();</script><div class="alert alert-success">Logged in. Reloading...</div>'
                        );
                    });
                } else {
                    $("#username").prop("disabled", false);
                    $("#password").prop("disabled", false);
                    $("#message")
                        .hide()
                        .html(
                            '<br/><div class="alert alert-danger">Wrong username or password</div>'
                        )
                        .fadeIn("fast");
                }
                console.log(response);
            }
        });
        return false;
    });
});

I have two fields name and preview. I have done validation for these fields (code below), but an error is returned to me when I add a file to the preview (error that I have to fill in this field)

const validationSchema = Yup.object().shape({
    name: Yup.string().required('Enter name'),
    preview: Yup.mixed().test('required', 'You need to provide a file', (file) => {
        if (file) return true
        return false
    }),
})

interface AddCategoryProps {}

export default function AddCategory({}: AddCategoryProps) {
const {
        register,
        handleSubmit,
        formState: { errors },
    } = useForm({
        defaultValues: {},
        mode: 'onChange',
        resolver: yupResolver(validationSchema),
    })

    const onSubmit = handleSubmit(({ name, preview }) => {
        console.log({ name, preview })
    })

    return (
        <section className={styles.wrapper}>

            <form onSubmit={onSubmit} className={styles.form}>
                <AdminFormInput
                    register={register}
                    registerName='name'
                    errorText={errors.name?.message}
                    isError={Boolean(errors.name?.message)}
                    label='Name'
                />
                <AdminFormInput
                    register={register}
                    registerName='preview'
                    errorText={errors.preview?.message}
                    isError={Boolean(errors.preview?.message)}
                    label='Preview'
                    isFile={true}
                    previewText='Select file'
                />
                <AdminFormButton />
            </form>
        </section>
    )

}

// AdminFormInput //

import { useRef } from 'react'
import styles from './AdminFormInput.module.sass'
import { FieldValues, Path, UseFormRegister } from 'react-hook-form'

interface AdminFormInputProps<T extends FieldValues> {
    label: string
    isFile?: boolean
    previewText?: string
    isSelect?: boolean

    registerName: Path<T>
    register: UseFormRegister<T>
    isError: boolean
    errorText: string | undefined
}

export const AdminFormInput = <T extends FieldValues>({
    label,
    isFile,
    previewText,
    isSelect,
    registerName,
    register,
    isError,
    errorText,
}: AdminFormInputProps<T>) => {
    const fileRef = useRef<any>()

    return (
        <div className={styles.wrapper}>
            <label className={styles.title}>{label}</label>
            {!isFile && !isSelect && (
                <>
                    <input {...register(registerName)} type='text' className={styles.input} />
                    {isError && <span className={styles.error}>{errorText}</span>}
                </>
            )}

            {isFile && (
                <>
                    <input
                        {...register(registerName)}
                        type='file'
                        accept='image/png, image/gif, image/jpeg'
                        hidden
                        ref={fileRef}
                    />
                    <div className={styles.file} onClick={() => fileRef.current.click()}>
                        {previewText}
                    </div>
                    {isError && <span className={styles.error}>{errorText}</span>}
                </>
            )}
        </div>
    )
}

export default AdminFormInput

I tried to do this, but when I click on the submit button of the form, the name field is filled in, but the preview field remains undefined

const validationSchema = Yup.object().shape({
    name: Yup.string().required('Введите название категории'),
    preview: Yup.mixed()
    }),
})

Actually, the problem is that the preview field does not include the file that I select

i have needed html css js slider. The slider showing the three images on screen and scroll it become the infinte slider please

 <section>
                <div class="section-7">
                    <div class="client">
                        <h5>Happy Client’s</h5>
                        <h3>Our Customers Love What
                            We Do For Them</h3>
                    </div>
                    <div class="slider">
                        <div class="pre" id="pre"><img src="Images/pre.svg" alt=""></div>
                        <div class="main-slider">
                            <div class="slide">
                                <img class="name-img" src="Images/john.png" alt="">
                                <p class="name">John</p>
                                <p class="slide-para">Lorem ipsum dolor sit amet,
                                    consectetur
                                    adipiscing elit,
                                    sed do eiusmod tempor incididunt
                                    ut labore et dolore magna aliqua. Ut enim ad minim
                                    veniam,
                                    quis nostrud exercitation
                                    ullamco laboris nisi ut aliquip ex ea commodo
                                    consequat.
                                </p>
                            </div>
                            <div class="slide">
                                <img src="Images/ani.png" alt="">
                                <p class="name-img">Anna Doe</p>
                                <p class="slide-para">Lorem ipsum dolor sit amet,
                                    consectetur
                                    adipiscing elit,
                                    sed do eiusmod tempor incididunt
                                    ut labore et dolore magna aliqua. Ut enim ad minim
                                    veniam,
                                    quis nostrud exercitation
                                    ullamco laboris nisi ut aliquip ex ea commodo
                                    consequat.
                                </p>
                            </div>
                            <div class="slide">
                                <img class="name-img" src="Images/john.png" alt="">
                                <p class="name">John2</p>
                                <p class="slide-para">Lorem ipsum dolor sit amet,
                                    consectetur
                                    adipiscing elit,
                                    sed do eiusmod tempor incididunt
                                    ut labore et dolore magna aliqua. Ut enim ad minim
                                    veniam,
                                    quis nostrud exercitation
                                    ullamco laboris nisi ut aliquip ex ea commodo
                                    consequat.
                                </p>
                            </div>
                            <div class="slide">
                                <img class="name-img crickter"
                                    src="Images/shiad afridi.jpg" alt="">
                                <p class="name crickter">Afridi</p>
                                <p class="slide-para">Lorem ipsum dolor sit amet,
                                    consectetur
                                    adipiscing elit,
                                    sed do eiusmod tempor incididunt
                                    ut labore et dolore magna aliqua. Ut enim ad minim
                                    veniam,
                                    quis nostrud exercitation
                                    ullamco laboris nisi ut aliquip ex ea commodo
                                    consequat.
                                </p>
                            </div>
                            <div class="slide">
                                <img class="name-img crickter" src="Images/babaer.jpg"
                                    alt="">
                                <p class="name">Baber</p>
                                <p class="slide-para">Lorem ipsum dolor sit amet,
                                    consectetur
                                    adipiscing elit,
                                    sed do eiusmod tempor incididunt
                                    ut labore et dolore magna aliqua. Ut enim ad minim
                                    veniam,
                                    quis nostrud exercitation
                                    ullamco laboris nisi ut aliquip ex ea commodo
                                    consequat.
                                </p>
                            </div>
                            <div class="slide">
                                <img class="name-img crickter" src="Images/koli.jpg"
                                    alt="">
                                <p class="name">koli</p>
                                <p class="slide-para">Lorem ipsum dolor sit amet,
                                    consectetur
                                    adipiscing elit,
                                    sed do eiusmod tempor incididunt
                                    ut labore et dolore magna aliqua. Ut enim ad minim
                                    veniam,
                                    quis nostrud exercitation
                                    ullamco laboris nisi ut aliquip ex ea commodo
                                    consequat.
                                </p>
                            </div>
                        </div>
                        <div class="next" id="next"><img src="Images/next.svg" alt="">
                        </div>
                    </div>
            </section>

i have write this html code i provide you the design that type of slider i have needed so please
i have give you the slider picture i have needed that type of the slider center image become big and sides are less in lenth from the center . and i have also needed their responsive view.
please give the slider in the html css and easy and simple js code

j’aimerais creer un crud avec react-crud-table

vous pouvez m’ aidez en donnant un liens de video ou de documentation pour apprendre a faire un CRUD en react js en utilisant la dependance react-crud-table ….. de préference tuto video . merci beaucoup pour votre aide

I have some js files that are not loading. The code works sound if I use <script> //js code </script> in the page template but not if I try and load the script from a separate file.

here is page template: simsgen.php

`

    <?php include 'dlc_packs.php'; ?>

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <title>Dynamically Generated Labels</title>
        <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
     <script  src="<?php echo get_stylesheet_directory_uri() . '/challengeGenerator.js'; ?>">   </script>
        <script type="text/javascript" src="<?php echo get_stylesheet_directory_uri() . '/checkbox-interactions.js'; ?>"></script>
    </head>

    <body>

        <h2>Filters</h2>

        <label>
            <input type="checkbox" id="selectAllPacks"> Select All
        </label>
        <br>
        <label>
            <input type="checkbox" id="selectExpansionPacks" class="dlc-pack"> Select All Expansion Packs 
        </label>
        <label>
            <input type="checkbox" id="selectGamePacks" class="dlc-pack"> Select All Game Packs 
        </label>
        <label>
            <input type="checkbox" id="selectStuffPacks" class="dlc-pack"> Select All Stuff Packs 
        </label>

        <br>
        <div class="checkbox-container flex">
            <?php foreach ($dlcPacks as $label => $packs): ?>
                <h3><?= $label ?></h3>
                <?php foreach ($packs as $pack): ?>
                    
                    <label>
                        <input type="checkbox" class="dlc-pack" value="<?= $pack ?>"> <?= $pack ?>
                    </label>
                
                <?php endforeach; ?>
            <?php endforeach; ?>
        </div>

        <h3> Generate Build or Game Play</h3>
        <label for="selectBuildChallenge">
            <input type="checkbox" id="selectBuildChallenge" name="challengeType"> Build Challenge
        </label>
        <label for="selectGameChallenge">
            <input type="checkbox" id="selectGameChallenge" name="challengeType"> Game Challenge
        </label>

Generate Sim Build

       <div id="sim-build">   
       

 </div>
    </body>
    </html>

</main><!-- #main -->

`

here is checkbox-interactions.js

`$(document).ready(function() {
// Select All Checkbox Functionality
$(“#selectAllPacks”).click(function() {
$(“.dlc-pack”).prop(‘checked’, $(this).prop(‘checked’));
});

// Individual Checkbox Functionality
$(".dlc-pack").click(function() {
    if (!$(this).prop('checked')) {
        $("#selectAllPacks").prop('checked', false);
    } else {
        var allChecked = true;
        $(".dlc-pack").each(function() {
            if (!$(this).prop('checked')) {
                allChecked = false;
                return false; // Break out of loop
            }
        });
        $("#selectAllPacks").prop('checked', allChecked);
    }
});

});
`

tried enqueuing it from functions.php, calling it from a script file and linking the source. Doesn’t seem to work

I’m working on a WebRTC project that requires moderated webinar-type rooms.
On the server side it is based on Pion for SFU,
and on the browser side on a proprietary javascript client.

After several days of debugging,
I have still not been able to resolve the following behavior which only occurs on Firefox:
the broadcast to the participants works exactly once every other time.

Below I have included the room join SDPs for two peers A and B,
and those between peer A and the SFU, when changing the broadcast state of peer B.

This is a summary of what I can observe in peer A side
each time I enable the broadcast of the peer B.

Similar behaviors/info:

• both peers are on Firefox
• the SDPs generated by the SFU are similar, except for the mid identifiers,
  the audio/video tracks are always there
• negotiations never fail
• ontrack events are fired for both tracks on the javascript side
• codecs used are OPUS/VP8 for both peers
• there are no pending streams in either case in the javascript client,
  an applicative-level stream is pending when:
  • ontrack is not fired, for all the required tracks
  • all the applicative signaling events to initialize the new view is not received
• firefox about:webrtc shows:
  • ICE state succeeded selecting a trickled candidate that is nominated and selected:
    local: 192.168.1.3:58968/udp(host) [non-proxied]
    remote: 192.168.1.3:41440/udp(host)

Different behaviors/info when the broadcast fail:

• the audio/video tracks have reversed order (video first) in the SDP sent by the SFU to peer A
• onunmute event is triggered only for video track, but the view is blank
• when muting video track for peer B while broadcasting is enabled,
  onunmute event for the audio track is triggered on peer A,
  and the audio track becomes audible
• if the video track is keep muted for peer B while broadcasting
  is enabled/disabled, the peer A can always ear peer B
• I see only an inbound-rtp audio track when it doesn’t works,
  and inbound-rtp audio+video tracks when it works

Inbound audio track for the non-working case, note the high packet loss:

Decoder: 111 audio/opus2 channels 48000 maxplaybackrate=48000;stereo=1;useinbandfec=1

Local: 15:39:28 GMT+0200 (Central European Summer Time) inbound-rtpReceived 21,854 packets (1728.69 Kb , 8.0 KBps)Lost -10,927 packetsJitter 0.002

---

…snip….

Due to body limitation of 30k characters I have excluded SDPs exchange between peers and SFU to join the room.

You can find full info here.

…snip….

Peers A and B are succesfully connected to the SFU,
and neither of them sees the other as required.

---

From here only peer A renegotiate with the SFU.

Now peer B broadcasting is enabled to the participants (in that case the only peer A)

Remote SDP (offer from SFU)

v=0
o=- 6404238063867404676 1713866681 IN IP4 0.0.0.0
s=-
t=0 0
a=fingerprint:sha-256 47:6A:71:15:C0:01:A4:3E:B6:AC:C6:8B:E2:84:B1:C0:1D:49:6F:F1:14:0C:1F:C4:BD:B2:30:56:10:BB:9D:36
a=group:BUNDLE 0 1 2
m=audio 9 UDP/TLS/RTP/SAVPF 111 0 8 9
c=IN IP4 0.0.0.0
a=setup:actpass
a=mid:0
a=ice-ufrag:WRtsEOiaoItPEqup
a=ice-pwd:eadmhjMMzpurJPeaIqdGCwUyihOpRLzv
a=rtcp-mux
a=rtcp-rsize
a=rtpmap:111 opus/48000/2
a=fmtp:111 minptime=10;useinbandfec=1
a=rtpmap:0 PCMU/8000
a=rtpmap:8 PCMA/8000
a=rtpmap:9 G722/8000
a=ssrc:556646705 cname:{ccedd829-80b6-4d6e-95d5-5ea497e9a4fd}
a=ssrc:556646705 msid:{ccedd829-80b6-4d6e-95d5-5ea497e9a4fd} 6e65e23b-ca79-49c9-8fa2-1c8edada26e8
a=ssrc:556646705 mslabel:{ccedd829-80b6-4d6e-95d5-5ea497e9a4fd}
a=ssrc:556646705 label:6e65e23b-ca79-49c9-8fa2-1c8edada26e8
a=msid:{ccedd829-80b6-4d6e-95d5-5ea497e9a4fd} 6e65e23b-ca79-49c9-8fa2-1c8edada26e8
a=sendrecv
a=candidate:foundation 1 udp 2130706431 192.168.1.3 34668 typ host generation 0
a=candidate:foundation 2 udp 2130706431 192.168.1.3 34668 typ host generation 0
a=candidate:foundation 1 udp 2130706431 192.168.122.1 53777 typ host generation 0
a=candidate:foundation 2 udp 2130706431 192.168.122.1 53777 typ host generation 0
a=candidate:foundation 1 udp 2130706431 172.17.0.1 49086 typ host generation 0
a=candidate:foundation 2 udp 2130706431 172.17.0.1 49086 typ host generation 0
a=candidate:foundation 1 udp 16777215 2.32.201.189 51726 typ relay raddr 0.0.0.0 rport 54578 generation 0
a=candidate:foundation 2 udp 16777215 2.32.201.189 51726 typ relay raddr 0.0.0.0 rport 54578 generation 0
a=end-of-candidates
m=video 9 UDP/TLS/RTP/SAVPF 96 98 102
c=IN IP4 0.0.0.0
a=setup:actpass
a=mid:1
a=ice-ufrag:WRtsEOiaoItPEqup
a=ice-pwd:eadmhjMMzpurJPeaIqdGCwUyihOpRLzv
a=rtcp-mux
a=rtcp-rsize
a=rtpmap:96 VP8/90000
a=rtpmap:98 VP9/90000
a=rtpmap:102 H264/90000
a=fmtp:102 level-asymmetry-allowed=1;packetization-mode=1;profile-level-id=42001f
a=ssrc:2184094840 cname:{ccedd829-80b6-4d6e-95d5-5ea497e9a4fd}
a=ssrc:2184094840 msid:{ccedd829-80b6-4d6e-95d5-5ea497e9a4fd} ed97af1a-2ed6-4f13-9ca5-7a70008c7d9a
a=ssrc:2184094840 mslabel:{ccedd829-80b6-4d6e-95d5-5ea497e9a4fd}
a=ssrc:2184094840 label:ed97af1a-2ed6-4f13-9ca5-7a70008c7d9a
a=msid:{ccedd829-80b6-4d6e-95d5-5ea497e9a4fd} ed97af1a-2ed6-4f13-9ca5-7a70008c7d9a
a=sendrecv
a=candidate:foundation 1 udp 2130706431 192.168.1.3 34668 typ host generation 0
a=candidate:foundation 2 udp 2130706431 192.168.1.3 34668 typ host generation 0
a=candidate:foundation 1 udp 2130706431 192.168.122.1 53777 typ host generation 0
a=candidate:foundation 2 udp 2130706431 192.168.122.1 53777 typ host generation 0
a=candidate:foundation 1 udp 2130706431 172.17.0.1 49086 typ host generation 0
a=candidate:foundation 2 udp 2130706431 172.17.0.1 49086 typ host generation 0
a=candidate:foundation 1 udp 16777215 2.32.201.189 51726 typ relay raddr 0.0.0.0 rport 54578 generation 0
a=candidate:foundation 2 udp 16777215 2.32.201.189 51726 typ relay raddr 0.0.0.0 rport 54578 generation 0
a=end-of-candidates
m=application 9 DTLS/SCTP 5000
c=IN IP4 0.0.0.0
a=setup:actpass
a=mid:2
a=sendrecv
a=sctpmap:5000 webrtc-datachannel 1024
a=ice-ufrag:WRtsEOiaoItPEqup
a=ice-pwd:eadmhjMMzpurJPeaIqdGCwUyihOpRLzv
a=candidate:foundation 1 udp 2130706431 192.168.1.3 34668 typ host generation 0
a=candidate:foundation 2 udp 2130706431 192.168.1.3 34668 typ host generation 0
a=candidate:foundation 1 udp 2130706431 192.168.122.1 53777 typ host generation 0
a=candidate:foundation 2 udp 2130706431 192.168.122.1 53777 typ host generation 0
a=candidate:foundation 1 udp 2130706431 172.17.0.1 49086 typ host generation 0
a=candidate:foundation 2 udp 2130706431 172.17.0.1 49086 typ host generation 0
a=candidate:foundation 1 udp 16777215 2.32.201.189 51726 typ relay raddr 0.0.0.0 rport 54578 generation 0
a=candidate:foundation 2 udp 16777215 2.32.201.189 51726 typ relay raddr 0.0.0.0 rport 54578 generation 0
a=end-of-candidates

Local SDP (answer from Firefox)

v=0
o=mozilla...THIS_IS_SDPARTA-99.0 957846499555280282 2 IN IP4 0.0.0.0
s=-
t=0 0
a=fingerprint:sha-256 F1:90:80:57:6B:21:4B:3B:46:39:BE:EC:DD:DA:8B:EB:0B:41:CA:39:42:87:F6:71:CC:DD:E9:86:4D:3D:F4:00
a=group:BUNDLE 0 1 2
a=ice-options:trickle
a=msid-semantic:WMS *
m=audio 35036 UDP/TLS/RTP/SAVPF 111 0 8 9
c=IN IP4 2.32.201.189
a=candidate:0 1 UDP 2122252543 192.168.1.3 45832 typ host
a=candidate:3 1 UDP 2122187007 192.168.122.1 57330 typ host
a=candidate:6 1 UDP 2122121471 172.17.0.1 57309 typ host
a=candidate:9 1 TCP 2105524479 192.168.1.3 9 typ host tcptype active
a=candidate:11 1 TCP 2105458943 192.168.122.1 9 typ host tcptype active
a=candidate:13 1 TCP 2105393407 172.17.0.1 9 typ host tcptype active
a=candidate:10 1 UDP 8331263 2.32.201.189 35036 typ relay raddr 2.32.201.189 rport 35036
a=candidate:12 1 UDP 8265727 2.32.201.189 50962 typ relay raddr 2.32.201.189 rport 50962
a=candidate:14 1 UDP 8200191 2.32.201.189 50650 typ relay raddr 2.32.201.189 rport 50650
a=sendrecv
a=end-of-candidates
a=fmtp:111 maxplaybackrate=48000;stereo=1;useinbandfec=1
a=ice-pwd:ad33262c89431a763c05ff11078b9726
a=ice-ufrag:d238b152
a=mid:0
a=msid:{23cd2d5f-bba0-44c1-864c-a2e45ef7dea9} {72b45279-8868-4950-a352-62f19035b630}
a=rtcp-mux
a=rtpmap:111 opus/48000/2
a=rtpmap:0 PCMU/8000
a=rtpmap:8 PCMA/8000
a=rtpmap:9 G722/8000/1
a=setup:passive
a=ssrc:3915669289 cname:{0cc435ca-987f-4679-abe7-e250eb82ec3a}
m=video 9 UDP/TLS/RTP/SAVPF 96 98
c=IN IP4 0.0.0.0
a=sendrecv
a=fmtp:96 max-fs=12288;max-fr=60
a=fmtp:98 max-fs=12288;max-fr=60
a=ice-pwd:ad33262c89431a763c05ff11078b9726
a=ice-ufrag:d238b152
a=mid:1
a=msid:{23cd2d5f-bba0-44c1-864c-a2e45ef7dea9} {91e5cfec-72bd-4df9-a367-c17769f8be97}
a=rtcp-mux
a=rtcp-rsize
a=rtpmap:96 VP8/90000
a=rtpmap:98 VP9/90000
a=setup:passive
a=ssrc:2924201237 cname:{0cc435ca-987f-4679-abe7-e250eb82ec3a}
m=application 9 DTLS/SCTP 5000
c=IN IP4 0.0.0.0
a=sendrecv
a=ice-pwd:ad33262c89431a763c05ff11078b9726
a=ice-ufrag:d238b152
a=mid:2
a=sctpmap:5000 webrtc-datachannel 256
a=setup:passive
a=max-message-size:1073741823

Peer A can see/ear peer B.

---

Disabling the broadcasting results as follows:

Remote SDP (offer from SFU)

v=0
o=- 5646507004176508049 1713867601 IN IP4 0.0.0.0
s=-
t=0 0
a=fingerprint:sha-256 47:6A:71:15:C0:01:A4:3E:B6:AC:C6:8B:E2:84:B1:C0:1D:49:6F:F1:14:0C:1F:C4:BD:B2:30:56:10:BB:9D:36
a=group:BUNDLE 0 1 2
m=audio 9 UDP/TLS/RTP/SAVPF 111 0 8 9
c=IN IP4 0.0.0.0
a=setup:actpass
a=mid:0
a=ice-ufrag:WRtsEOiaoItPEqup
a=ice-pwd:eadmhjMMzpurJPeaIqdGCwUyihOpRLzv
a=rtcp-mux
a=rtcp-rsize
a=rtpmap:111 opus/48000/2
a=fmtp:111 minptime=10;useinbandfec=1
a=rtpmap:0 PCMU/8000
a=rtpmap:8 PCMA/8000
a=rtpmap:9 G722/8000
a=recvonly
a=candidate:foundation 1 udp 2130706431 192.168.1.3 34668 typ host generation 0
a=candidate:foundation 2 udp 2130706431 192.168.1.3 34668 typ host generation 0
a=candidate:foundation 1 udp 2130706431 192.168.122.1 53777 typ host generation 0
a=candidate:foundation 2 udp 2130706431 192.168.122.1 53777 typ host generation 0
a=candidate:foundation 1 udp 2130706431 172.17.0.1 49086 typ host generation 0
a=candidate:foundation 2 udp 2130706431 172.17.0.1 49086 typ host generation 0
a=candidate:foundation 1 udp 16777215 2.32.201.189 51726 typ relay raddr 0.0.0.0 rport 54578 generation 0
a=candidate:foundation 2 udp 16777215 2.32.201.189 51726 typ relay raddr 0.0.0.0 rport 54578 generation 0
a=end-of-candidates
m=video 9 UDP/TLS/RTP/SAVPF 96 98 102
c=IN IP4 0.0.0.0
a=setup:actpass
a=mid:1
a=ice-ufrag:WRtsEOiaoItPEqup
a=ice-pwd:eadmhjMMzpurJPeaIqdGCwUyihOpRLzv
a=rtcp-mux
a=rtcp-rsize
a=rtpmap:96 VP8/90000
a=rtpmap:98 VP9/90000
a=rtpmap:102 H264/90000
a=fmtp:102 level-asymmetry-allowed=1;packetization-mode=1;profile-level-id=42001f
a=recvonly
a=candidate:foundation 1 udp 2130706431 192.168.1.3 34668 typ host generation 0
a=candidate:foundation 2 udp 2130706431 192.168.1.3 34668 typ host generation 0
a=candidate:foundation 1 udp 2130706431 192.168.122.1 53777 typ host generation 0
a=candidate:foundation 2 udp 2130706431 192.168.122.1 53777 typ host generation 0
a=candidate:foundation 1 udp 2130706431 172.17.0.1 49086 typ host generation 0
a=candidate:foundation 2 udp 2130706431 172.17.0.1 49086 typ host generation 0
a=candidate:foundation 1 udp 16777215 2.32.201.189 51726 typ relay raddr 0.0.0.0 rport 54578 generation 0
a=candidate:foundation 2 udp 16777215 2.32.201.189 51726 typ relay raddr 0.0.0.0 rport 54578 generation 0
a=end-of-candidates
m=application 9 DTLS/SCTP 5000
c=IN IP4 0.0.0.0
a=setup:actpass
a=mid:2
a=sendrecv
a=sctpmap:5000 webrtc-datachannel 1024
a=ice-ufrag:WRtsEOiaoItPEqup
a=ice-pwd:eadmhjMMzpurJPeaIqdGCwUyihOpRLzv
a=candidate:foundation 1 udp 2130706431 192.168.1.3 34668 typ host generation 0
a=candidate:foundation 2 udp 2130706431 192.168.1.3 34668 typ host generation 0
a=candidate:foundation 1 udp 2130706431 192.168.122.1 53777 typ host generation 0
a=candidate:foundation 2 udp 2130706431 192.168.122.1 53777 typ host generation 0
a=candidate:foundation 1 udp 2130706431 172.17.0.1 49086 typ host generation 0
a=candidate:foundation 2 udp 2130706431 172.17.0.1 49086 typ host generation 0
a=candidate:foundation 1 udp 16777215 2.32.201.189 51726 typ relay raddr 0.0.0.0 rport 54578 generation 0
a=candidate:foundation 2 udp 16777215 2.32.201.189 51726 typ relay raddr 0.0.0.0 rport 54578 generation 0
a=end-of-candidates

Local SDP (answer from Firefox)

v=0
o=mozilla...THIS_IS_SDPARTA-99.0 957846499555280282 3 IN IP4 0.0.0.0
s=-
t=0 0
a=fingerprint:sha-256 F1:90:80:57:6B:21:4B:3B:46:39:BE:EC:DD:DA:8B:EB:0B:41:CA:39:42:87:F6:71:CC:DD:E9:86:4D:3D:F4:00
a=group:BUNDLE 0 1 2
a=ice-options:trickle
a=msid-semantic:WMS *
m=audio 35036 UDP/TLS/RTP/SAVPF 111 0 8 9
c=IN IP4 2.32.201.189
a=candidate:0 1 UDP 2122252543 192.168.1.3 45832 typ host
a=candidate:3 1 UDP 2122187007 192.168.122.1 57330 typ host
a=candidate:6 1 UDP 2122121471 172.17.0.1 57309 typ host
a=candidate:9 1 TCP 2105524479 192.168.1.3 9 typ host tcptype active
a=candidate:11 1 TCP 2105458943 192.168.122.1 9 typ host tcptype active
a=candidate:13 1 TCP 2105393407 172.17.0.1 9 typ host tcptype active
a=candidate:10 1 UDP 8331263 2.32.201.189 35036 typ relay raddr 2.32.201.189 rport 35036
a=candidate:12 1 UDP 8265727 2.32.201.189 50962 typ relay raddr 2.32.201.189 rport 50962
a=candidate:14 1 UDP 8200191 2.32.201.189 50650 typ relay raddr 2.32.201.189 rport 50650
a=sendonly
a=end-of-candidates
a=fmtp:111 maxplaybackrate=48000;stereo=1;useinbandfec=1
a=ice-pwd:ad33262c89431a763c05ff11078b9726
a=ice-ufrag:d238b152
a=mid:0
a=msid:{23cd2d5f-bba0-44c1-864c-a2e45ef7dea9} {72b45279-8868-4950-a352-62f19035b630}
a=rtcp-mux
a=rtpmap:111 opus/48000/2
a=rtpmap:0 PCMU/8000
a=rtpmap:8 PCMA/8000
a=rtpmap:9 G722/8000/1
a=setup:passive
a=ssrc:3915669289 cname:{0cc435ca-987f-4679-abe7-e250eb82ec3a}
m=video 9 UDP/TLS/RTP/SAVPF 96 98
c=IN IP4 0.0.0.0
a=sendonly
a=fmtp:96 max-fs=12288;max-fr=60
a=fmtp:98 max-fs=12288;max-fr=60
a=ice-pwd:ad33262c89431a763c05ff11078b9726
a=ice-ufrag:d238b152
a=mid:1
a=msid:{23cd2d5f-bba0-44c1-864c-a2e45ef7dea9} {91e5cfec-72bd-4df9-a367-c17769f8be97}
a=rtcp-mux
a=rtcp-rsize
a=rtpmap:96 VP8/90000
a=rtpmap:98 VP9/90000
a=setup:passive
a=ssrc:2924201237 cname:{0cc435ca-987f-4679-abe7-e250eb82ec3a}
m=application 9 DTLS/SCTP 5000
c=IN IP4 0.0.0.0
a=sendrecv
a=ice-pwd:ad33262c89431a763c05ff11078b9726
a=ice-ufrag:d238b152
a=mid:2
a=sctpmap:5000 webrtc-datachannel 256
a=setup:passive
a=max-message-size:1073741823

---

Reenabling the broadcasting results as follows:

Remote SDP (offer from SFU)

v=0
o=- 8896423429130464586 1713867815 IN IP4 0.0.0.0
s=-
t=0 0
a=fingerprint:sha-256 47:6A:71:15:C0:01:A4:3E:B6:AC:C6:8B:E2:84:B1:C0:1D:49:6F:F1:14:0C:1F:C4:BD:B2:30:56:10:BB:9D:36
a=group:BUNDLE 0 1 2 3 4
m=audio 9 UDP/TLS/RTP/SAVPF 111 0 8 9
c=IN IP4 0.0.0.0
a=setup:actpass
a=mid:0
a=ice-ufrag:WRtsEOiaoItPEqup
a=ice-pwd:eadmhjMMzpurJPeaIqdGCwUyihOpRLzv
a=rtcp-mux
a=rtcp-rsize
a=rtpmap:111 opus/48000/2
a=fmtp:111 minptime=10;useinbandfec=1
a=rtpmap:0 PCMU/8000
a=rtpmap:8 PCMA/8000
a=rtpmap:9 G722/8000
a=recvonly
a=candidate:foundation 1 udp 2130706431 192.168.1.3 34668 typ host generation 0
a=candidate:foundation 2 udp 2130706431 192.168.1.3 34668 typ host generation 0
a=candidate:foundation 1 udp 2130706431 192.168.122.1 53777 typ host generation 0
a=candidate:foundation 2 udp 2130706431 192.168.122.1 53777 typ host generation 0
a=candidate:foundation 1 udp 2130706431 172.17.0.1 49086 typ host generation 0
a=candidate:foundation 2 udp 2130706431 172.17.0.1 49086 typ host generation 0
a=candidate:foundation 1 udp 16777215 2.32.201.189 51726 typ relay raddr 0.0.0.0 rport 54578 generation 0
a=candidate:foundation 2 udp 16777215 2.32.201.189 51726 typ relay raddr 0.0.0.0 rport 54578 generation 0
a=end-of-candidates
m=video 9 UDP/TLS/RTP/SAVPF 96 98 102
c=IN IP4 0.0.0.0
a=setup:actpass
a=mid:1
a=ice-ufrag:WRtsEOiaoItPEqup
a=ice-pwd:eadmhjMMzpurJPeaIqdGCwUyihOpRLzv
a=rtcp-mux
a=rtcp-rsize
a=rtpmap:96 VP8/90000
a=rtpmap:98 VP9/90000
a=rtpmap:102 H264/90000
a=fmtp:102 level-asymmetry-allowed=1;packetization-mode=1;profile-level-id=42001f
a=recvonly
a=candidate:foundation 1 udp 2130706431 192.168.1.3 34668 typ host generation 0
a=candidate:foundation 2 udp 2130706431 192.168.1.3 34668 typ host generation 0
a=candidate:foundation 1 udp 2130706431 192.168.122.1 53777 typ host generation 0
a=candidate:foundation 2 udp 2130706431 192.168.122.1 53777 typ host generation 0
a=candidate:foundation 1 udp 2130706431 172.17.0.1 49086 typ host generation 0
a=candidate:foundation 2 udp 2130706431 172.17.0.1 49086 typ host generation 0
a=candidate:foundation 1 udp 16777215 2.32.201.189 51726 typ relay raddr 0.0.0.0 rport 54578 generation 0
a=candidate:foundation 2 udp 16777215 2.32.201.189 51726 typ relay raddr 0.0.0.0 rport 54578 generation 0
a=end-of-candidates
m=application 9 DTLS/SCTP 5000
c=IN IP4 0.0.0.0
a=setup:actpass
a=mid:2
a=sendrecv
a=sctpmap:5000 webrtc-datachannel 1024
a=ice-ufrag:WRtsEOiaoItPEqup
a=ice-pwd:eadmhjMMzpurJPeaIqdGCwUyihOpRLzv
a=candidate:foundation 1 udp 2130706431 192.168.1.3 34668 typ host generation 0
a=candidate:foundation 2 udp 2130706431 192.168.1.3 34668 typ host generation 0
a=candidate:foundation 1 udp 2130706431 192.168.122.1 53777 typ host generation 0
a=candidate:foundation 2 udp 2130706431 192.168.122.1 53777 typ host generation 0
a=candidate:foundation 1 udp 2130706431 172.17.0.1 49086 typ host generation 0
a=candidate:foundation 2 udp 2130706431 172.17.0.1 49086 typ host generation 0
a=candidate:foundation 1 udp 16777215 2.32.201.189 51726 typ relay raddr 0.0.0.0 rport 54578 generation 0
a=candidate:foundation 2 udp 16777215 2.32.201.189 51726 typ relay raddr 0.0.0.0 rport 54578 generation 0
a=end-of-candidates
m=video 9 UDP/TLS/RTP/SAVPF 96 98 102
c=IN IP4 0.0.0.0
a=setup:actpass
a=mid:3
a=ice-ufrag:WRtsEOiaoItPEqup
a=ice-pwd:eadmhjMMzpurJPeaIqdGCwUyihOpRLzv
a=rtcp-mux
a=rtcp-rsize
a=rtpmap:96 VP8/90000
a=rtpmap:98 VP9/90000
a=rtpmap:102 H264/90000
a=fmtp:102 level-asymmetry-allowed=1;packetization-mode=1;profile-level-id=42001f
a=ssrc:2184094840 cname:{ccedd829-80b6-4d6e-95d5-5ea497e9a4fd}
a=ssrc:2184094840 msid:{ccedd829-80b6-4d6e-95d5-5ea497e9a4fd} ed97af1a-2ed6-4f13-9ca5-a989ded52e33
a=ssrc:2184094840 mslabel:{ccedd829-80b6-4d6e-95d5-5ea497e9a4fd}
a=ssrc:2184094840 label:ed97af1a-2ed6-4f13-9ca5-a989ded52e33
a=msid:{ccedd829-80b6-4d6e-95d5-5ea497e9a4fd} ed97af1a-2ed6-4f13-9ca5-a989ded52e33
a=sendrecv
a=candidate:foundation 1 udp 2130706431 192.168.1.3 34668 typ host generation 0
a=candidate:foundation 2 udp 2130706431 192.168.1.3 34668 typ host generation 0
a=candidate:foundation 1 udp 2130706431 192.168.122.1 53777 typ host generation 0
a=candidate:foundation 2 udp 2130706431 192.168.122.1 53777 typ host generation 0
a=candidate:foundation 1 udp 2130706431 172.17.0.1 49086 typ host generation 0
a=candidate:foundation 2 udp 2130706431 172.17.0.1 49086 typ host generation 0
a=candidate:foundation 1 udp 16777215 2.32.201.189 51726 typ relay raddr 0.0.0.0 rport 54578 generation 0
a=candidate:foundation 2 udp 16777215 2.32.201.189 51726 typ relay raddr 0.0.0.0 rport 54578 generation 0
a=end-of-candidates
m=audio 9 UDP/TLS/RTP/SAVPF 111 0 8 9
c=IN IP4 0.0.0.0
a=setup:actpass
a=mid:4
a=ice-ufrag:WRtsEOiaoItPEqup
a=ice-pwd:eadmhjMMzpurJPeaIqdGCwUyihOpRLzv
a=rtcp-mux
a=rtcp-rsize
a=rtpmap:111 opus/48000/2
a=fmtp:111 minptime=10;useinbandfec=1
a=rtpmap:0 PCMU/8000
a=rtpmap:8 PCMA/8000
a=rtpmap:9 G722/8000
a=ssrc:556646705 cname:{ccedd829-80b6-4d6e-95d5-5ea497e9a4fd}
a=ssrc:556646705 msid:{ccedd829-80b6-4d6e-95d5-5ea497e9a4fd} 6e65e23b-ca79-49c9-8fa2-db07bcf7d813
a=ssrc:556646705 mslabel:{ccedd829-80b6-4d6e-95d5-5ea497e9a4fd}
a=ssrc:556646705 label:6e65e23b-ca79-49c9-8fa2-db07bcf7d813
a=msid:{ccedd829-80b6-4d6e-95d5-5ea497e9a4fd} 6e65e23b-ca79-49c9-8fa2-db07bcf7d813
a=sendrecv
a=candidate:foundation 1 udp 2130706431 192.168.1.3 34668 typ host generation 0
a=candidate:foundation 2 udp 2130706431 192.168.1.3 34668 typ host generation 0
a=candidate:foundation 1 udp 2130706431 192.168.122.1 53777 typ host generation 0
a=candidate:foundation 2 udp 2130706431 192.168.122.1 53777 typ host generation 0
a=candidate:foundation 1 udp 2130706431 172.17.0.1 49086 typ host generation 0
a=candidate:foundation 2 udp 2130706431 172.17.0.1 49086 typ host generation 0
a=candidate:foundation 1 udp 16777215 2.32.201.189 51726 typ relay raddr 0.0.0.0 rport 54578 generation 0
a=candidate:foundation 2 udp 16777215 2.32.201.189 51726 typ relay raddr 0.0.0.0 rport 54578 generation 0
a=end-of-candidates

Local SDP (answer from Firefox)

v=0
o=mozilla...THIS_IS_SDPARTA-99.0 957846499555280282 4 IN IP4 0.0.0.0
s=-
t=0 0
a=fingerprint:sha-256 F1:90:80:57:6B:21:4B:3B:46:39:BE:EC:DD:DA:8B:EB:0B:41:CA:39:42:87:F6:71:CC:DD:E9:86:4D:3D:F4:00
a=group:BUNDLE 0 1 2 3 4
a=ice-options:trickle
a=msid-semantic:WMS *
m=audio 35036 UDP/TLS/RTP/SAVPF 111 0 8 9
c=IN IP4 2.32.201.189
a=candidate:0 1 UDP 2122252543 192.168.1.3 45832 typ host
a=candidate:3 1 UDP 2122187007 192.168.122.1 57330 typ host
a=candidate:6 1 UDP 2122121471 172.17.0.1 57309 typ host
a=candidate:9 1 TCP 2105524479 192.168.1.3 9 typ host tcptype active
a=candidate:11 1 TCP 2105458943 192.168.122.1 9 typ host tcptype active
a=candidate:13 1 TCP 2105393407 172.17.0.1 9 typ host tcptype active
a=candidate:10 1 UDP 8331263 2.32.201.189 35036 typ relay raddr 2.32.201.189 rport 35036
a=candidate:12 1 UDP 8265727 2.32.201.189 50962 typ relay raddr 2.32.201.189 rport 50962
a=candidate:14 1 UDP 8200191 2.32.201.189 50650 typ relay raddr 2.32.201.189 rport 50650
a=sendonly
a=end-of-candidates
a=fmtp:111 maxplaybackrate=48000;stereo=1;useinbandfec=1
a=ice-pwd:ad33262c89431a763c05ff11078b9726
a=ice-ufrag:d238b152
a=mid:0
a=msid:{23cd2d5f-bba0-44c1-864c-a2e45ef7dea9} {72b45279-8868-4950-a352-62f19035b630}
a=rtcp-mux
a=rtpmap:111 opus/48000/2
a=rtpmap:0 PCMU/8000
a=rtpmap:8 PCMA/8000
a=rtpmap:9 G722/8000/1
a=setup:passive
a=ssrc:3915669289 cname:{0cc435ca-987f-4679-abe7-e250eb82ec3a}
m=video 9 UDP/TLS/RTP/SAVPF 96 98
c=IN IP4 0.0.0.0
a=sendonly
a=fmtp:96 max-fs=12288;max-fr=60
a=fmtp:98 max-fs=12288;max-fr=60
a=ice-pwd:ad33262c89431a763c05ff11078b9726
a=ice-ufrag:d238b152
a=mid:1
a=msid:{23cd2d5f-bba0-44c1-864c-a2e45ef7dea9} {91e5cfec-72bd-4df9-a367-c17769f8be97}
a=rtcp-mux
a=rtcp-rsize
a=rtpmap:96 VP8/90000
a=rtpmap:98 VP9/90000
a=setup:passive
a=ssrc:2924201237 cname:{0cc435ca-987f-4679-abe7-e250eb82ec3a}
m=application 9 DTLS/SCTP 5000
c=IN IP4 0.0.0.0
a=sendrecv
a=ice-pwd:ad33262c89431a763c05ff11078b9726
a=ice-ufrag:d238b152
a=mid:2
a=sctpmap:5000 webrtc-datachannel 256
a=setup:passive
a=max-message-size:1073741823
m=video 9 UDP/TLS/RTP/SAVPF 96 98
c=IN IP4 0.0.0.0
a=recvonly
a=fmtp:96 max-fs=12288;max-fr=60
a=fmtp:98 max-fs=12288;max-fr=60
a=ice-pwd:ad33262c89431a763c05ff11078b9726
a=ice-ufrag:d238b152
a=mid:3
a=rtcp-mux
a=rtcp-rsize
a=rtpmap:96 VP8/90000
a=rtpmap:98 VP9/90000
a=setup:active
a=ssrc:1868673906 cname:{0cc435ca-987f-4679-abe7-e250eb82ec3a}
m=audio 9 UDP/TLS/RTP/SAVPF 111 0 8 9
c=IN IP4 0.0.0.0
a=recvonly
a=fmtp:111 maxplaybackrate=48000;stereo=1;useinbandfec=1
a=ice-pwd:ad33262c89431a763c05ff11078b9726
a=ice-ufrag:d238b152
a=mid:4
a=rtcp-mux
a=rtpmap:111 opus/48000/2
a=rtpmap:0 PCMU/8000
a=rtpmap:8 PCMA/8000
a=rtpmap:9 G722/8000/1
a=setup:active
a=ssrc:2201530307 cname:{0cc435ca-987f-4679-abe7-e250eb82ec3a}

Peer A cannot see/ear again the peer B.

I have an angular app where I display PDF as blob with iframes and most of them works. Now there is one file, which is a little bit bigger (15 pages) and while it is working on Firefox and other browsers it is not working on Edge. When inspecting the iframe in Edge i can see ‘about:blank#blocked’
What could be the reason that other pdfs are working but not that one? Could size be the issue? I feel like 15 pages is not that much, but I’m not sure with Edge. All other browsers are showing the pdf. Anyone had similar issues?

It would be great not to be dependend on third parties.

Any help appreciated.

I tried iframe, embed and object. All not working with Edge.

I’m working on the react-native project.
In a few screens, I’m getting the error “Error Rendered fewer hooks than expected. This may be caused by an accidental early return statement.”

I tried to fix this by checking some similar questions here but could not find anything to fix this issue.

Also, there is no conditional hook which is the general cause of this issue.

Please refer below code

import {
  StatusBar,
  StyleSheet,
  Text,
  View,
  ScrollView,
  TouchableOpacity,
} from 'react-native';
import React, {useEffect, useRef, useState} from 'react';
import {globalStyle} from '../../utils/styles';
import AppBar from '../../components/appBar/AppBar';
import {useTheme} from 'react-native-paper';
import MapView, {Marker, PROVIDER_GOOGLE} from 'react-native-maps';
import {useNavigation} from '@react-navigation/native';
import Icon from 'react-native-vector-icons/Entypo';
import {Box3} from '../../components/text/Box';
import {apiCallSecureGet, apiUrl} from '../../utils/api';

const HomeAddressScreen = () => {
  const theme = useTheme();
  const mapRef = useRef();
  const navigation = useNavigation();
  const [addressData, setAddressData] = useState({});

  useEffect(() => {
    apiCallSecureGet(
      apiUrl.profile,
      response => {
        setAddressData(response?.data);
      },
      error => {
        console.log('Home Address api failed', error);
      },
    );
  }, []);
  const updateAddressHandler = () => {
    navigation.navigate('UpdateAddress');
  };

  return (
    <ScrollView>
      <StatusBar backgroundColor={'blue'} />
      <View
        style={[
          globalStyle.appBarContainer,
          {backgroundColor: theme.colors.primary},
        ]}>
        <AppBar title={'Home Address'} />
      </View>
      <View
        style={[
          globalStyle.curveContainer,
          {backgroundColor: theme.colors.white},
        ]}>
        {/* add your content below  */}
        <View style={styles.mapContainer}>
          <MapView
            // ref={mapRef}
            style={styles.map}
            scrollEnabled={false}
            rotateEnabled={false}
            loadingEnabled={true}
            showsMyLocationButton={true}
            showsUserLocation={true}
            provider={PROVIDER_GOOGLE}
            initialRegion={{
              latitude: addressData?.profile?.lat || 24.6653189,
              longitude: addressData?.profile?.lng || 46.721565,
              latitudeDelta: 0.1,
              longitudeDelta: 0.1,
            }}>
            <Marker
              pinColor="green"
              coordinate={{
                latitude: addressData?.profile?.lat || 24.6653189,
                longitude: addressData?.profile?.lng || 46.721565,
                latitudeDelta: 0.1,
                longitudeDelta: 0.1,
              }}
            />
          </MapView>
        </View>

        <View style={styles.editContainer}>
          <TouchableOpacity onPress={updateAddressHandler} style={styles.edit}>
            <Icon name="edit" />
          </TouchableOpacity>
        </View>

        <View style={styles.content}>
          <Box3 title={'Address'} text={addressData?.profile?.address} />
          <Box3 title={'Landmark'} text={addressData?.profile?.landmark} />
        </View>
      </View>
    </ScrollView>
  );
};

export default HomeAddressScreen;

Error is coming on line no 29, setAddressData(response?.data); when I set data into state.

I develop an app with node.js Fastify framework (typescript, ES syntax). I use Webpack to bundle the app and to compile typescript. The app bundles successfully, but when I try to run the resulting bundle.cjs file, I get the following error:

eferenceError: require is not defined in ES module scope, you can use import instead
    at Object.events (file:///home/myzader/vc-app/backend/dist/bundle.mjs:601068:1)
    at __webpack_require__ (file:///home/myzader/vc-app/backend/dist/bundle.mjs:613956:41)
    at ./node_modules/pino/lib/proto.js (file:///home/myzader/vc-app/backend/dist/bundle.mjs:612505:26)
    at __webpack_require__ (file:///home/myzader/vc-app/backend/dist/bundle.mjs:613956:41)
    at ./node_modules/pino/pino.js (file:///home/myzader/vc-app/backend/dist/bundle.mjs:613549:15)
    at __webpack_require__ (file:///home/myzader/vc-app/backend/dist/bundle.mjs:613956:41)
    at ./node_modules/fastify/lib/logger.js (file:///home/myzader/vc-app/backend/dist/bundle.mjs:607600:14)
    at __webpack_require__ (file:///home/myzader/vc-app/backend/dist/bundle.mjs:613956:41)
    at ./node_modules/fastify/lib/reply.js (file:///home/myzader/vc-app/backend/dist/bundle.mjs:608101:21)
    at __webpack_require__ (file:///home/myzader/vc-app/backend/dist/bundle.mjs:613956:41)

I tried to adjust the webpack configs. When I add some package to the externals array, it dooesn’t throw the error any more, but I geet the same error for another package from dependencies. I need a help definitely, Thank you!

const config = {
  mode: 'development',
  devtool: 'source-map',
  entry: './app.ts',
  target: 'node',
  resolve: {
    extensions: ['.ts', '.js', '.mjs'],
  },
  output: {
    path: path.resolve(__dirname, 'dist'),
    filename: 'bundle.mjs', // Change the extension to .mjs
    library: {
      type: 'module' // Change the library type to 'module'
    },
    chunkFormat: 'module' // Change the chunk format to 'module'
  },
  experiments: {
    outputModule: true
  },
  externals: [
    nodeExternals({
      allowlist: ['canvas', 'fastify', 'avvio', 'fastq', 'reusify', '@fastify/error', 'process-warning', 'abstract-logging', 'pino', 'pino-std-serializers', 'fast-redact', 'quick-format-unescaped'] 
    })
  ],
  module: {
    rules: [{
        test: /.(ts|js)$/, // Handle both .ts and .js files
        use: 'ts-loader',
        exclude: /node_modules/
      },
      {
        test: /.node$/, // Apply this rule to files ending in .node
        loader: 'node-loader', // Use the node-loader for all .node files
      },
    ],
  },
  stats: {
    errorDetails: true, // Display details of errors
    colors: true, // Output in colored format, useful in console
    modules: true, // Display modules information
    reasons: true, // Display the reason about why modules are included
    warnings: true, // Display warnings
  },
  plugins: [
    new webpack.ContextReplacementPlugin(
      /awilix/, // The module that includes dynamic requires
      (data) => {
        delete data.dependencies[0].critical; // Remove the critical flag from these dependencies
        return data;
      }
    ),
  ],
};

I want to remove the cache value of ip address for every 10sec of TTL value. The following is my code,

// İSTEMCİNİN '/' İSTEĞİNE KARŞILIK VEREN KOD BLOĞU
app.get('/getIpAdress/:url', function (req, res) { 
  dns.resolve4(req.params.url, { 'ttl': true }, (err, address, family) => {
    if (err) {
      let obj = {
        ip: '',
        statusCode: 1,
        resp: 'Ip address not found',
        timeStamp: new Date()
      }
      res.status(200).json(obj);
      return;
    };
    sendResponse(address, res);
  });

  function sendResponse(address, res) {
    let obj = {
      url: req.params.url,
      ip: address,
      resp: 'Ip address found',
      statusCode: 0,
      timeStamp: new Date()
    }
    res.status(200).json(obj);
  }
});
}

The above code returns ip and ttl but i want the ip to be changed for every 10 secs.

i am using the laravel 11 blade starter kit for my prject. I have a route for the display a particular property like this : Route::get('property/{property}', [PageController::class, 'property_id'])->name('property_id'); but i then changed it to this : Route::get('/{property}', [PageController::class, 'property_id'])->name('property_id');

I did this because with the first example i gave i was having issues with some images and css files not loading from my public folder, causing images not to show and some css not to work.

Now, when i chnaged to the other example, which is this: Route::get('/{property}', [PageController::class, 'property_id'])->name('property_id'); the images and css/js files started working on the page , but with that i later found out that none of the authentication pages was displaying , rather i got the 404 not found on the login, register and other authentication pages.

Please how can i fix this and make the authentication pages show again?

when i revert back to the first example , the authentication pages started display normally but causing the images and some css/js not to load on the property details page.

Please i need help. Thanks

I’m working on a WordPress project where I’ve created a form to submit data to an external API using JavaScript. The form appears to be structured correctly, but it’s not making the expected API request when I click the “Submit” button. There’s no error message in the frontend, but I suspect something is going wrong.

Below is my form code with the JavaScript function that handles the form submission and makes the API request. I’ve tried to ensure that the data is sanitized and that the request is set up correctly. However, I can’t identify the source of the problem.

// WordPress Shortcode Function
function availability_form() {
    ob_start();

    $hotel_code = get_field('hotel_code');
    $hotel_cityname = get_field('cityname');

    global $cities;
    global $hotels;

    ?>
    <div class="availability-form-container">
        <form class="availability-form desktopavail" onSubmit="return false;">
            <div>
                <label>City</label>
                <select id="form-city" class="cityname" required name="city">
                    <option>Select City</option>
                    <?php foreach ($cities as $row) { ?>
                        <option value="<?php echo $row; ?>" <?php if ($hotel_cityname == $row) { echo 'selected'; } ?>>
                            <?php echo $row; ?>
                        </option>
                    <?php } ?>
                </select>
            </div>

            <!-- Additional form fields -->

            <div>
                <label for="" style="opacity: 0;">Submit</label>
                <button type="submit" onClick="handleFormSubmission()">View Price</button>
            </div>
        </form>
    </div>

    <script>
        function handleFormSubmission() {
            var city = document.getElementById('form-city').value;
            // Collect other form data

            // API endpoint and request data
            var apiUrl = 'https://malc-integration-api-stage.thecapital.co.za/api/ChatBot/createBookingLink';
            var requestData = {
                city: city,
                // Additional data
            };

            var args = {
                method: 'POST',
                headers: {
                    'Content-Type': 'application/json',
                    'Authorization': 'Bearer YOUR_BEARER_TOKEN',
                },
                body: JSON.stringify(requestData),
            };

            fetch(apiUrl, args)
                .then(response => response.json())
                .then(data => {
                    console.log('Form submitted!', data);
                })
                .catch(error => {
                    console.error('API request failed:', error);
                });
        }
    </script>
    <?php

    return ob_get_clean();
}

Checked the browser console for errors (no errors were reported).
Verified that the form data is being collected correctly.
Ensured that the API endpoint and headers are correct.
Added error handling in the fetch call to capture any errors during the API request.

I am looking to organise subdomains for my app, where I can have the translations for them. E.g. en.example.com is for the English landing page. However, before I push to my repo, I want to test to see whether it works on localhost:3000. How can I achieve that using the pages route?

next.config.js

/** @type {import('next').NextConfig} */
const nextConfig = {
  reactStrictMode: true,
  i18n: {
    locales: ["en-US", "fr"],
    defaultLocale: "en-US",
    domains: [
      {
        domain: "en.example.com",
        defaultLocale: "en-US",
      },
      {
        domain: "fr.example.com",
        defaultLocale: "fr",
      },
    ],
  },
};

module.exports = nextConfig;

next-i18next.config.js

const path = require("path");

module.exports = {
  i18n: {
    defaultLocale: "en-US",
    locales: ["en-US", "fr"],
    localeDetection: true,
  },
  localePath: path.resolve("./public/locales"),
};

text.jsx

import { serverSideTranslations } from "next-i18next/serverSideTranslations";
import { useTranslation } from "next-i18next";
import { useRouter } from "next/router";

function Text() {
  const router = useRouter();
  console.log("router: ", router); // It thinks the local is "en-US", so it isn't working for http://fr.localhost:3000/test
  const { t } = useTranslation("common");

  return <h1>{t("greeting")}</h1>;
}

export default Text;

// This gets called on every request
export async function getServerSideProps({ locale }) {
  return {
    props: {
      // Load the 'common' namespace for the current locale
      ...(await serverSideTranslations(locale, ["common"])),
    },
  };
}

package.json

  "scripts": {
    "dev": "next dev -H 0.0.0.0"

tell solution

solve the problem tell solution also tell why this happening and please solve this problem and i m new in this field please help your brother and does visual studio is good for begineers and it is better than other….