Develop Reference

Securely pass current wordpress user to external flask app

I have a Wordpress site with users, and a separate Flask app with logic for responding to Get/Post requests from the WordPress site.
I am able to get the current user into a JavaScript variable on the WP site and send to the Flask app - however how do I ensure that someone cannot pretend to be a different current user, or make this secure to other potential vulnerabilities?
Is there some way of exposing a token or suchlike to JavaScript on the WP side, which then the Flask app can verify, say by using the WordPress API?

We would likely need a little bit more detail to be sure the best way to solve, but it seems there are a few ways of approaching this.
You've said that you can get the user id into JavaScript. I'm presuming this means the browser is needing to make the connection to the Flask app. If you have the option of doing this with the WordPress site calling the Flask app directly (server-to-server) you can avoid a lot of hassle.
If you are able to send the request directly from the WordPress server to the Flask app, and the Flask app can check that the source of the request is the WordPress site (either by a shared secret, by checking the IP address the request came from, or just by filtering the traffic to the Flask app to only permit the WordPress server) then do that and you can be sure of the identity of the user making the request.
But if the request has to be made to the Flask app from the browser, then you could do this in a couple of general ways:
Encrypt the value from WP to Flask -- Create a shared secret on the server(s) which is used to encrypt or sign the user id. The WP site would generate the encrypted/signed version of the user id and send that to the browser. The browser javascript code would send this to the Flask app, which would (knowing the shared secret) decrypt the id or verify the signature. This is the simpliest method.
Use an opaque ID -- Generate a random number in the server-side code of the WP site, and record the user id that it was generated for. Send the random number to the browser, which sends it on to the Flask app. Flask then asks WordPress what the user id associated with that random number is.

You need to send the data directly from backend side, but if it depends on a frontend trigger, you can then send an AJAX request from JavaScript to backend in WP side.
jQuery.post( admin_ajax_url, { action: 'get_current_user' } );
and without the nopriv, This function will be triggered only for logged in users.
add_action( 'wp_ajax_get_current_user', 'ajax_get_current_user' );
inside the function, you can get the current user WP_User object and the user ID.
function ajax_get_current_user() {
$current_user_object = wp_get_current_user();
$current_user_id = get_current_user_id();
// Send the User details to flash App here...
}
This is a quick walkthrough of how it should be done. sure, AJAX request will need a nonce check, and sanitization for any passed data, etc.
More details about AJAX request in WP
https://developer.wordpress.org/plugins/javascript/ajax/
https://developer.wordpress.org/plugins/javascript/enqueuing/
https://jackreichert.com/2013/03/24/using-ajax-in-wordpress-development-the-quickstart-guide/
and the WP HTTP API for sending the data to the flask app
https://developer.wordpress.org/plugins/http-api/

You need WordPress Application Passwords. It's essentially a password for APIs.
In your case, you need to define the application password of the WordPress user in Flask, then Flask can send requests to the WordPress REST API as an authenticated user.

Shopify non - embedded apps

I want to make Shopify non - embedded apps, I have installed the pre-built code which Shopify provides to build an embedded app. In the server.js file, after the user installs our app, it gets the access Token successfully. In order to make an API request to graphql server, it requires the access token to the headers. I am struggling with this point, I don't know how to get that access token from the backend and make API calls on the frontend, I want to use Apollo Client to show query data on the frontend, but I don't know how to use that accessToken after the merchants install the app, it has generated it in the server.js file, which is the backend. Are there any tutorials or docs on what I am trying to achieve.

It seems like this is going to apply for any type of front-end that you're using and isn't specific to Apollo, have you tried checking the related doc? If so, add the relevant code to your question 🤠

Is there a way to prevent user from changing JS script location?

I am creating a JS API that is made to fetch data from my website. To use the API, user is required to include the script in their website html. The API will then display data from my website into their website accordingly. I am using ajax to call the endpoint url of my website.
However, insecurity concern is that, malicious user can create their own API and call the endpoint url.
I was thinking of checking server HTTP_REFERER, getting script id then checking the src of the script. However, the server HTTP_REFERER can be changed programmatically.
Is there a way to prevent user from changing JS script location or checking if the script src has been changed? Or in general, how can I prevent user from using their own script or cURL to call my endpoint url?
I am using PHP LARAVEL as backend language.

I think there is no certain way to prevent this on the client side. It's always right to secure the backend. To authorize users, try using OAuth 2.0; Laravel passport is a good implementation. This will secure your APIs.

Angular JS +ASP.NET WEB API+SITEMINDER

We are building a web app on angularJS and WEB API 2.2, basic funtctionality of the app is to download documents from certain Fileshare.
Talking in architectural details, these two apps (angular JS and REST API) will be hosted on two different websites(ie clientAPP.com and RESTAPI.com).
We need to protect our ClientAPP with siteminder here but also which can be done easily, complexity here is, for downloading the files instead of using APIController i have used MVCController for its FILECONTENTRESULT behaviour, so basically i redirect my users(when they click on the file links provided on angular UI) to that controller using:
$window.location.href="DOWNLOADCONTROLLER/DownloadFile/IDOfTheDocument"
In turn this url returns the intended file by searching it on the basis of id provided in URL and returns filecontentresult which automatically downloads the file on browser.
We need another functionality where we can share this download file URL with other users, we need to implement security around this URL as well which is part of RESTAPI MVC app, we are marking our options on "how do we protect this URL" since it's an MVC controller we cannot go for token based security like we have done it for API controllers so and also we cannot share tioken with users so, is it possible make this URL siteminder protected so that when user hits this url from browser instead of app it gets the SSO login screen? if yes, how do we ensure that when my user is already logged in to client app,REST API doesn't ask for authentication when he tries to download the file from the client APP,.

Using PHP login along side OAuth2

So I am creating a website to learn some PHP/Javascript/HTML/CSS and so on and I ran into a problem to which I can't come up with a solution. So basically I have regular login form using PHP which uses POST to send the data and authenticate. I also want to integrate external Twitch.tv OAuth2 authentication.
By using normal PHP login I store my information inside PostgreSQL database using php. I want to do something similar using OAuth2. For example store Twitch.tv name as a username inside the database and token as a password.
The problem is that the external authentication I am using is based on their Javascript API and it stores the information inside the DOM storage which I found is unable to be access by using PHP. The redirect_uri with a token is also a fragment which can't be retrieved by PHP.
Should I just scrap the JS part and try doing it entirely in PHP?
Side question: I checked other website which also uses Twitch authentication and it uses these callback links "https://api.nightbot.tv/auth/twitch/callback?code=****". What exactly are these callbacks?

You should use redirects as you implied with JS frameworks. It works the same with Facebook.
The redirects are used with a token. Usually you generate on your side a random token that you store in the session.
Once the user logs in using the JS API, the API will redirect to a callback page (PHP in your case).
In that page, you verify the token once (that you had passed and got back, must be the same), and also you get another token from the API to use with the API.
At this point you can get the user information by querying the API using the API token.
You get the user info from the API and then you can query your down DB at this point to log the user in etc.
I hope this helps..