CODEWITHSUNDEEP
javascriptreactjsrequestfetchadblock
Artifs
Artifs

Reputation: 21

Adblock destroys my site on react js (Adblock blocks all fetch and axios requests)

I made a course project on React JS and uploaded it to the hosting. After I sent my site to a friend, he said that almost nothing works for him, either eternal downloads, or the site does not return validation results, and others. When I started to understand, I realized that he had errors "Failed to load resource: net::ERR_BLOCKED_BY_CLIENT", after disabling the Adblock extension, all the functionality of the site began to work properly. In my question, there is no question of trifles, such as blocking images, absolutely all requests to the server are blocked for me. My site is designed so that on the front there is only a visual and requests for the back, and on the back, all user actions are processed and the result is returned, on which the actions of the front depend, you can see for yourself, "site" that I have constant errors in the console on the client side, and when you disable the ad blocker, everything starts working. My code is quite large, but if you have suspicions about some specific code sections, then I can provide them. Below is one of the usual requests to the server, most of them are, there are a couple more axios requests, but there are very few of them, but they are also blocked. I also saw similar problems with ajax requests on other threads, but I never saw a specific reason for all the blocks.

        var form = new FormData()
    form.append('JSONPARSE',true);
    fetch("http://g908020p.beget.tech",{
        method: 'POST',
        body: form
    })
    .then(response => response.text())
    .then(response => {
        var json = JSON.parse(response)
        setCatalog(json.items)
        setLoading(true)
        console.log(json)

    })
    .catch(error => {
        console.log(error)
    })

Upvotes: 1

Views: 1519

Answers (1)

Valera Kvip
Valera Kvip

Reputation: 390

Yes, related to this post, the adblock parses the URL for some pattern.

I cheated this by using a third party server that wrapped my request.
Check it out:
https://codetabs.com/cors-proxy/cors-proxy.html

  fetch("https://api.codetabs.com/v1/proxy?quest=http://g908020p.beget.tech")

Of course you can wrap it with your own server.

Upvotes: 0

Related Questions