Netlify Forms and service worker - netlify

I'm trying to setup netlify forms on my website. I finger out that this thing doesn't work with my service worker (even when I place just basic SW). Without SW, everything works just fine.

You don't have to unregister and re-register your service worker to get netlify forms running with it. A much more simple approach is to bypass the SW cache by always adding a unique string to the url you post your form to.
In my case I am using the browsers fetch method and instead of having it post to just "/" I add a timestamp to the url like so: "/?t=1234652736"
const postUrl = '/?t=' + Math.floor(Date.now() / 1000);
fetch(postUrl, {
method: 'post',
headers: {
'Content-Type': 'application/x-www-form-urlencoded',
},
body: ...),
})
You dont have to use fetch it also works with ajax via axios for example.

Thnx to Netlify support I fix my problem. Those guys there are the best (having a free account and so much help from them till today is awesome). Because Service worker hijacks form to request that's why Netlify didn't catch any of my form submissions.
Solution:
You need to disable service worker on the contact page:
<script>
navigator.serviceWorker.getRegistrations().then(function(registrations)
{
for (let registration of registrations) {
registration.unregister()
}
})
</script>
After that service worker will be disabled from now on, if you want to be sure that service worker will work again after submission, just add action to the sucsses page where service worker will be registered again
<form name="Netlify Form" method="post" data-netlify="true" action="/send">

Related

How to send data (2 strings) from a next.js server to a node.js server and then update values on the node.js server with the new data

Apologies if I sound uneducated on the matter, I have never used JS until a few days ago and don't have much server/API experience.
Essentially I am using nextauth.js to authenticate a users twitter account and allow them to sign into an app. Next.js is providing them with a sign in option and once they sign in and authorize the app I now have access to their api key/ secret.
I also created an app in node.js that will allow me to change their twitter header for them. This runs on a separate port. I need to be able to send the key/secret I get from the next.js app to the node server so that I can use these keys to make the changes to their account. I am unsure of how to do this and what type of requests are required.
Ive spend a good amount of time looking into online resources but I haven't been able to conceptualize it fully. Any help/resources/explanations would be very appreciated! Thank you in advance!
if you have access to secret key you wanna send on the client-side you can simply use fetch
const response = await fetch('https://yourbackend.url/here', {
method: 'POST', // make sure the method is set to POST
headers: {
'Accept': 'application/json, text/plain, */*',
'Content-Type': 'application/json'
},
body: JSON.stringify({secretKey: "yourseceretkeyhereaslkdaasldkaslkdjlask"}) // send the secret as payload in the body
}).then(res => res.json())
.catch(console.log);
catching the payload on your server will totally depend on what kind of server you have setup.

403 error with axios but works on postman and browser

I get Nfts on magic eden with this third party api.
http://api-mainnet.magiceden.io/rpc/getGlobalActivitiesByQuery?q=%7B%22%24match%22%3A%7B%22txType%22%3A%22initializeEscrow%22%2C%22blockTime%22%3A%7B%22%24gt%22%3A1643468983%7D%7D%2C%22%24sort%22%3A%7B%22blockTime%22%3A-1%7D%7D
It responses with results on postman and browser but causes 403 error with axios in node.js.
How can I get data in node.js?
const res = await axios.get(
'http://api-mainnet.magiceden.io/rpc/getGlobalActivitiesByQuery?q=%7B%22%24match%22%3A%7B%22txType%22%3A%22initializeEscrow%22%2C%22blockTime%22%3A%7B%22%24gt%22%3A1643468983%7D%7D%2C%22%24sort%22%3A%7B%22blockTime%22%3A-1%7D%7D',
{
headers : {
"Content-Type": "application/json",
"Access-Control-Allow-Credentials": "*"
}
}
);
return res.data;
Using a proxy here won't help as they have Cloudflare protection set up against bots/scripts and it requires cookies to be present: screenshot 1, screenshot 2
You should get in touch with their support and ask for the API key (they have a public API v2 coming soon), and then use it in Authorization: Bearer <token>
Few things to note here: Their API v2 is still in works and lacks some basic features. Using their current v1 API does not require having an API key (that's what their support personnel said) but it does have bot protection against scripted attacks.
I'm hesitant to go with the API v2 since it lacks even the most basic stuff and I don't expect it to come out anytime soon. Personally, I'm looking to get in touch with people who managed to integrate the v1 into their applications, to see what necessary steps they followed in order to be able to do it.
If you managed to find some new info on that regard let me know. I'll also edit this comment in case I find out how to set up the v1 connection properly.
EDIT: managed to get it working by using the https://github.com/puppeteer/puppeteer library. Started a small headless instance of Chrome and I hit the ME API with that browser like so: screenshot 3
It can be because of CORS error.
You can use Cors proxy to fix it.
Try it,please.
const CORS_PROXY_API = `https://cors.ryanking13.workers.dev/?u=`;
const magicedenAPI = `http://api-mainnet.magiceden.io/rpc/getGlobalActivitiesByQuery?q=%7B%22%24match%22%3A%7B%22txType%22%3A%22initializeEscrow%22%2C%22blockTime%22%3A%7B%22%24gt%22%3A1643468983%7D%7D%2C%22%24sort%22%3A%7B%22blockTime%22%3A-1%7D%7D`
const { data } = await axios({
method: 'get',
url: `${CORS_PROXY_API}${magicedenAPI}`
});

Is it possible to send `postMessage` to an app with Cypress? How to pass data that would be received via `postMessage`?

I'm creating Cypress e2e tests, however our app is opened as a modal (iframe) on top of a parent page. As Cypress does not support iframes I decided to try and run app "standalone". However on start app is getting data from parent page via window.postMessage (info about flow and session). Is it possible to pass this data to app via Cypress?
I have tried to get data that we receive from backend via cy.request and it solves problem with session data, however I still can't figure out how to pass information about flow.
You can send a window.postMessage() in Cypress. Because Cypress runs in the browser next to your application, it has access to all web APIs.
In order to get a reference to the window object of your application, you can use cy.window()
Putting it all together, this is how you send a postMessage to your application under test:
cy.window() // get a reference to application's `window`
.then($window => {
const message = 'some data here'
$window.postMessage(message, '*')
})
Sending POST forms when visiting a page is indeed possible. As of Cypress 3.2.0, you can send POST requests using cy.visit.
You can check the cy.visit() docs for more details, but here is a quick code example of what you're trying to do:
cy.visit({
url: 'http://my-app.com/standalone-iframe-modal.html',
method: 'POST',
body: {
formKey: 'some-value',
anotherKey: 'some-other-value'
}
})

How to authorize for Amazon's Alexa API?

I want to send a request to this Amazon Alexa API.
That page contains the last 50 activities I made with my Amazon Echo. The page returns JSON. Before you can request that page, you need to authorize your account, so the proper cookies are set in your browser.
If I do something simple as:
const rp = require("request-promise");
const options = {
method: "GET",
uri: "https://alexa.amazon.com/api/activities?startTime=&size=50&offset=-1",
json: true
};
rp(options).then(function(data) {
console.log(data);
}).catch(function(err) {
console.log(err);
});
I can send a GET request to that URL. This works fine, except Amazon has no idea it's me who's sending the request, because I haven't authorized my NodeJS application.
I've successfully copied ~10 cookies from my regular browser into an incognito tab and authorized that way, so I know copying the cookies will work. After adding them all using tough-cookie, it didn't work, unfortunately. I still got redirected to the signin page (according to the error response).
How do I authorize for this API, so I can send my requests?
I have been looking for a solution for this too. The best idea I have is to use account linking, but I haven't try it yet. Looks like ASK-CLI has interface for this also, but I can't figure it out how to use it (what is that URL?). For linking account to 3rd party server is not easy, but link it back to Amazon for the json API should not be that complicated.

Sending POST from node.js - how does a website identify me?

there is a website that works with virtual items for an online game. I made a chrome extension that automates some actions on that website. Since I'd like to make this run on my raspberryPi (and chromium with the extension seems to be too slow and unefficient) I am trying to move this into node.js.
The login for the website works with Steam OpenID. It allows you to select items from a list, click a few buttons, then it sends you a tradeoffer on steam.
My extension works with the website while I was logged in there. It receives their database with jQuery getJSON, loops through the array, pushes some values into an array and then sends a post request telling the website which items I want and which items I am offering.
Here is how I am sending the request from chrome:
function withdrawXHR(botId, playerItems, botItems) {
$.ajax({
url: websiteURL,
type: 'post',
data: {
"steamid": botId,
"peopleItems": playerItems,
"botItems": botItems
},
success: function (data) {
console.error('>> Done: ' + data)
console.log("")
},
error: function(XMLHttpRequest, textStatus, errorThrown) {
console.error('>> Error: ' + errorThrown)
console.log("")
}
});
}
I can do everything in node so far like receiving their database, working through it, filter out the values I need, but I can't manage to send a working request. The problem is probably the login / how the website knows who I am.
I used wrapAPI (a chrome extension) to catch the request that is being sent when manually working with the website. Here is what it looks like:
So these are the things I am wondering about:
How would I send this request from node?
How does the website know who I am? They obviously know, because they are sending me an offer, but I can't see any "personal" data in that request.
Would I need to log into Steam OpenId from Node in some way? Is that possible?
What is a CF-RAY? (See the end of the captured request).
I am quite new to JS and requests in general and even "newer" to Node.js. I don't fully understand how the background of sending requests works. I would just need some tips, ideas on how to achieve my goal here.
Any help is greatly appreciated! Thank you! :)
You cannot use XMLHttpRequest for resources across domains. ( incidentally, unless you are using an extension)
I would look into grabbing express.js, and something called CORS. CORS permits cross-domain requests.
Here: http://enable-cors.org/server_expressjs.html
And here is some information on XHR requests in browser extensions: https://developer.chrome.com/extensions

Resources