Download URL in Firebase not displaying in React Native - firebase

1I am getting the download URL from the image I uploaded to firebase storage. But once I put the url as a uri in an image tag in React Native, it does not display. How do I fix this?
Image 1
Image 2
Trying to display download url

I would:
console.log() your download URL to confirm that it is a valid string
try hard-coding that same (valid) URL into your <Image src={...}> to see that it works/doesn't work (i.e. eliminate the asynchronous nature of setting state variable values)
ensure that theuser.updateP....() (can't see the function name in the photo) is synchronous, and if not then ensure you are calling the asynchronous function correctly
just before the return() that outputs the <Image>, add a console.log(Profilepic) to ensure it has the value you expect it to have
what is calling getData() ?
I would NOT be using the photoURL (or any other fields other than UID) from the Authentication object. Instead, as Firebase suggests, move your "user profile" information into a real database (Firestore, RTDB, or some other system). The "profile information" in Authentication is of limited use and there are major delays between calls to update the data before the information becomes available for use.

Related

Generated token from "useradd" operation does not work

I've been told by support to write here, so:
I'm using the "useradd" endpoint to add users for my app. However, after the user is successfully created, the token I'm getting does not actually work.
Weirdly enough I can see it in the dashboard, but shortly after I try using it on the client JS code, it disappears from there.
Seems like some sort of weird bug to me, but not sure. 🤷‍♂️
Also: When I either regenerate the token on the dashboard by hand before trying it, or add it after it disappears, that one would work.
Post your code and how you are generating token. Whatever unique string you use for generating token MUST also be used when you call setAppName
Read tutorials here https://mesibo.com/documentation/tutorials/get-started/first-app/
Turns out if was because the backend normalises whatever app id I use.
So "GoneWithTheWind" becomes "gonewiththewind", and hence if you use "GoneWithTheWind" in the JS setAppName call, it won't work.
(And your token will disappear for some reason as well.)
Leading- and trailing whitespaces are stripped as well.
Also, numeric "app id" is fine, just make sure that it's used as a string in the JS code, so for example: setAppName("4567").

How to pass any URL to an APIFY task?

There is a box to configure the "Start URL" in APIFY, but what happens if i don't know the start URL and it depends of my user input? I would like to be able to pass a variable URL to "Start URL"
Configuration of Start URL in APIFY:
I want to pass any URL automatically through an APIFY task and then scrap it.
I tried to make it automatically through Zapier, in the configuration is possible to select the URL input and pass it to APIFY, but finally it stops the task because is not able to read the format passed. Data out log from Zapier:
I think that APIFY probably lets configure dynamic input URL's but by my beginner level, probably there is something that scapes from my knowledge.
I want to be able to pass variable URL's to be scraped by APIFY.
You can check how input looks like in JSON format using Editor/JSON switcher on the top of input configuration.
After you switch to JSON you can easily check the structure of startUrls.
If you want to override startUrls for example in Zapier integration you can do it using Input JSON overrides field in Run Task Apify<>Zapier action.
You can override input same way using API to run the task, where you need to pass JSON as POST payload of the API request.
If you want to read more about Apify<>Zapier integration you can check article Scrape single URL using Zapier.

Firebase Storage - URL for image services

I'm trying to get Firebase Storage to work with an image service like Imgix or Cloudinary. However, the download URL's that Firebase provides, do not seem to work with these services.
For example: Cloudinary says you can fetch images like this:
http://res.cloudinary.com/demo/image/fetch/http://upload.wikimedia.org/wikipedia/commons/0/0c/Scarlett_Johansson_C%C3%A9sars_2014.jpg
However, my download URL looks more like this:
https://firebasestorage.googleapis.com/v0/b/project-503247351211329470.appspot.com/changedsoitdoesnotwork/o/O8Hv4nKOyGgcCyOLoVLH7cQw48y2%2Fimages%2F1.jpeg?alt=media&token=28eabf76-f85b-45aa-das3-fd945729d7c2
I changed some characters in the above url, so it won't work since I don't want a gazillion requests from Stackoverflow. :)
Is there something I can do differently? Can I perhaps make requests straight to the Storage Bucket?
You can absolutely use a service like Imgix or Cloudinary with Firebase Storage URLs--the issue here (as is true with 99% of cases like this) is that the URL needs to be percent escaped when used in the fetch.
If we have a URL like: https://firebasestorage.googleapis.com/v0/b/fir-cloudvisiontest.appspot.com/o/images%2Fimage.jpg?alt=media&token=TOKEN
It will need to be escaped to something like: https%3A%2F%2Ffirebasestorage.googleapis.com%2Fv0%2Fb%2Ffir-cloudvisiontest.appspot.com%2Fo%2Fimages%252Fimage.jpg%3Falt%3Dmedia%26token%3D61d35caf-b209-485f-8248-a3c2aa717468 (yes, it actually re-escapes the escaped any percent encoding).
That would result in a Cloudinary URL which looks like: http://res.cloudinary.com/<your-project>/image/fetch/https%3A%2F%2Ffirebasestorage.googleapis.com%2Fv0%2Fb%2Ffir-cloudvisiontest.appspot.com%2Fo%2Fimages%252Fimage.jpg%3Falt%3Dmedia%26token%3DTOKEN
Given service differences in tolerance for URL encoding, your mileage may vary, so I recommend testing URLs with a tool like http://meyerweb.com/eric/tools/dencoder/ to verify that your images work.
When using any of the cloudinary SDKs, you can create a fetch URL using the url() method. The following example uses the JavaScript SDK:
var cl = cloudinary.Cloudinary.new( {cloud_name: "<your cloud>"});
var storageRef = firebase.storage().ref();
storageRef.child('images/image.jpg').getDownloadURL().then(function(url) {
var cloudinary_url = cl.url(url, {type: "fetch"});
// Do something with the URL...
console.log(cloudinary_url);
}
This will ensure that the URL is properly encoded.

Extract part of an URL behind a login page with Paw

I'm a newbie but I think Paw can do what i need :
I need to extract a session id behind a login page.
I go to https://admin.booking.com, filling the form (login and pass) and the landing page behind includes a session id :
https://admin.booking.com/pc/index.html?ses=xxxxyyyyyzzzzz11112222233333
I'd like to :
1) Push credentials with Paw as part of my request,
2) get the above item (ses) item as a response so i can use the php script extension provided by Paw and then call this script "on demand".
Is this possible ? If so, what should i do ?
Thanks for your help
UPDATE*: we've added a documentation article to describe the process a little more: Login via a web form in Paw. We've detailed the process to deal with CSRF tokens too.
Paw isn't quite yet ready for handling web/HTML forms. Though, there's one way to do it the right way: if you inspect the form with the Chrome dev tools you'll find the name of the input from the DOM/HTML:
In your case, you have the inputs: loginname, password, lang.
Also, find the <form…> tag to see what's the action attribute. If there's no action attribute (like in your example), it means the target URL for your form is the current page's URL (https://admin.booking.com/ in your case). Also, make sure the method="POST" is also there in the <form…> tag, otherwise this method won't work.
Then jump into Paw and set:
URL (in your case https://admin.booking.com/)
method to POST
go to the Body tab and use "Form URL-Encoded + fill up the fields from your form
If all works, you'll see Paw show a redirection request, and if you go to the right-hand side panel under "Response" > "Headers", you should see a Location header with a value similar to the URL you initially mentioned (https://admin.booking.com/pc/index.html?ses=xxxxyyyyyzzzzz11112222233333). Hurray! You got your value into Paw!
Now that you have that, you can create in a new request (click on the + button at the bottom of the left-hand side list). And wherever you want to use this session token/ID, you can insert a dynamic value to retrieve that URL value. You have more infos here, in our docs, but I'll describe the steps here:
On whichever field you want to insert the token, right-click and pick Responses > Response Header.
Make sure you pick the first request in the "Request" dropdown menu, and enter Location in the "Header" field:
You should see the value of the Location header of the previous response appear here.
Now what you want to do is to extract only the part you want (i.e. the value of the ses param in your case). For that you'll need that extension for Paw, so please install it now: https://luckymarmot.com/paw/extensions/RegExMatch
Copy the dynamic value you have just inserted (the blue token), and right-click on that field to insert a new dynamic value, and pick Extensions > RegExp match:
In the Input field, paste the previous dynamic value you copied. And use the RegExp field to write a regular expression that will successfully extract the part of the URL you want (this should work in your case ses=(.*)).
Now that you're set up. You should be able to use this little new blue token wherever you like and automagically extract the value from the previous form. And whenever you send again the initial request, and get a new token, everything else will also update! :)
It was a little long guide, but I hope this will help you and hopefully others too.

Is it possible to return HTTP code 200, but give a "better" url without using 3xx?

Consider StackOverflow, where each question has a unique ID, but URLs are often overridden to include a stub in the URL. For readability and other reasons the stub helps users know they are at the right place.
I have a site that returns 200 when calling a URL like:
http://stackoverflow.com/questions/28057406/
But want the URL to update to:
http://stackoverflow.com/questions/28057406/is-it-possible-to-return-http-code-200-but-give-a-better-url-without-using-3x
The first call is technically valid and the code can retrieve the object and render it perfectly fine, but I'd like to update the URL to use the stubified one.
I'd prefer to do this without a redirect as just getting the ID causes a database call to get the object. Which would mean with a redirect the process would be:
Call http://stackoverflow.com/questions/28057406/
Retrieve item 25257999 from the database to get the name to make the stub
Redirect to http://stackoverflow.com/questions/28057406/is-it-possible-to-return-http-code-200-but-give-a-better-url-without-using-3x
New HTTP Call, so retrieve item 25257999 from the database to render the final page.
If possible I'd like to not use Javascript either.
So, is it possible to return Location as part of a HTTP header with a status code of 200 and the actual page, or am I stuck using 3xx calls or Javascript?
If you are just doing HTTP, you can either choose to redirect, or not choose to redirect... You can also (with Content-Location) tell the client that the canonical address is actually somewhere else... but no browser will respond to that.
To avoid the database-call, you could of course just cache the result.
If you are in a browser however, you can dynamically update the current address without forcing a refresh, with window.history.pushState.
For more information about that call, see this other SO answer:
Modify the URL without reloading the page

Resources