The files will primarily be images and webms, potentially zip files <100MB. The time frame should be almost real time or within a few seconds.
dimanche 31 octobre 2021
Number of free dynos running
So, after my research on stackoverflow and other portals, I have not found any answer to the below question. I am using a free Heroku account without any kind of payments. If I run, say 2, applications on the free account, does it mean that I am using 2 dynos. Because I know that two dynos will consume double the dyno hours(If both the applications never sleep. I am aware of these basics of Heroku), and so this is a concern for me.
Flutter's ListView.builder with custom controller will not respond to PageUp/PageDown key events on the web
If I create a long list in Flutter Web with a ListView.builder, I get the mouse wheel events and the PageUp/PageDown keyboard events working fine. If I specify a custom ScrollController, the PageUp/PageDown keyboard events are no longer captured. How can I fix that? Here's a simple example
import 'package:flutter/material.dart';
void main() {
runApp(const MyApp());
}
class MyApp extends StatelessWidget {
const MyApp({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return const MaterialApp(
home: MyHomePage(),
);
}
}
class MyHomePage extends StatefulWidget {
const MyHomePage({Key? key}) : super(key: key);
@override
State<MyHomePage> createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
late ScrollController _controller;
@override
void initState() {
_controller = ScrollController();
super.initState();
}
@override
void dispose() {
_controller.dispose();
super.dispose();
}
@override
Widget build(BuildContext context) {
return Scaffold(
body: Center(
child: ListView.builder(
itemCount: 500,
controller: _controller, // will not respond to PageUp, PageDown
itemBuilder: (BuildContext context, int i) => Text('Item $i'))),
);
}
}
If you comment out the controller: _controller line, the PageUp/PageDown presses work.
Is this a bug? If not, what do I need to do to my custom controller to respond to PageUp/PageDown?
Thank you for your help, Tony
How do I use local storage PLUS API in Vue version 2?
I'm trying to make a to-do list where the list is filled with tasks from an asynchronous query. I also want to add tasks and have them saved to my local storage. However, when I mount the local storage below mounting the API, the API disappears. When I put them both in the same mount, the local storage part doesn't work. What am I doing wrong?
var app = new Vue({
el: '#app',
data () {
return {
items: [{
title: "",
completed: false,
}],
title: '',
show: 'all',
}
},
mounted () {
axios
.get("https://jsonplaceholder.typicode.com/todos")
.then(response => this.items = response.data)
},
mounted () {
if(localStorage.item) this.item = localStorage.item;
},
Run Python project in a website, but interactively
I am using Infinityfree to host a website, and I have a project that I have created in Python 3. It is a bot to play a dice game and the code is here: https://github.com/matthews-makes/qaike. I encourage you to check out the code and run it to see how it interacts with the user.
I would like to let an online user run my bot and be able to pass text input. I didn't think that would be too hard, but I can't find an option online that doesn't involve a lot of manual input shredding.
I have read about Python Web Frameworks (like Flask and Django), and I like the idea, but I don't think they actually use the code to go back and forth with the user, but more use it to render web pages based on user input.
I have read about Brython and thought it would work, but I can't seem to actually run my file, display output, and accept input.
NOTE: I highly recommend you look at the code on Github! NOTE: I am new to hosting websites, so if you get into the nitty-gritty, please explain well or link an appropriate tutorial. Thank you in advance!
I want to do a code that will open you 5 different tabs of rick roll. I have managed to do the opening part part, but I want 5 DIFFERENT tabs [closed]
#importing the moudles
import webbrowser
import time
x = 0
#a five times loop
while x != 5:
#the rick roll link
webbrowser.open_new_tab("https://www.youtube.com/watch?v=dQw4w9WgXcQ")
x += 1
time.sleep
Execute Vanilla JS Scripts in React after DOM Render
I'm struggling my head for 5 hrs to get out of this issue, I've put some <script> tags in the index.html file that resides in the public folder. I want them to execute after the Browser has rendered the HTML completely, I know this is very basic question, but the problem is, I'm converting an HTML template to React, and it heavily uses animations, which I can't afford to write in react again from start. Here is my code
<!DOCTYPE html>
<html lang="en">
<head>
<title>Galaxy App</title>
<!--CSS-->
<link href="asset/css/icofont.min.css" rel="stylesheet" />
<link href="asset/css/linearicons.min.css" rel="stylesheet" />
<link href="asset/css/magnific-popup.min.css" rel="stylesheet" />
<link href="asset/css/animsition.min.css" rel="stylesheet" />
<link href="asset/css/bootstrap.min.css" rel="stylesheet" />
<link href="asset/css/swiper.min.css" rel="stylesheet" />
<link href="asset/css/styles.css" rel="stylesheet" />
<link href="asset/css/main.css" rel="stylesheet" />
<link href="asset/css/homepage.css" rel="stylesheet" />
<!--Theme CSS-->
<link href="asset/css/theme.css" rel="stylesheet" />
<link href="asset/css/responsive.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script>
</head>
<body>
<div id="root"></div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.6.0/slick.js"></script>
<script src="asset/js/polyfill.min.js"></script>
<script src="asset/js/jquery.min.js"></script>
<script src="asset/js/jquery.viewport.min.js"></script>
<script src="asset/js/jQuerySimpleCounter.min.js"></script>
<script src="asset/js/jquery.magnific-popup.min.js"></script>
<script src="asset/js/animsition.min.js"></script>
<script src="asset/js/isotope.pkgd.min.js"></script>
<script src="asset/js/bootstrap.bundle.min.js"></script>
<script src="asset/js/rellax.min.js"></script>
<script src="asset/js/swiper.min.js"></script>
<script src="asset/js/smoothscroll.js"></script>
<script src="asset/js/svg4everybody.legacy.min.js"></script>
<script src="asset/js/TweenMax.min.js"></script>
<script src="asset/js/TimelineLite.min.js"></script>
<script src="asset/js/typed.min.js"></script>
<script src="asset/js/vivus.min.js"></script>
<script src="asset/js/main.js"></script>
<!-- Theme JS -->
<script src="asset/js/theme.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/slick-carousel/1.6.0/slick.js"></script>
<script src="asset/js/cutsom.js"></script>
</body>
</html>
I manually checked by logging the document.getElementById() in the last script, and it returns undefined/null because at that time the HTML is not rendered completely, even though I've put the scripts at the end of file. it works if I add setTimeout in my script, and it captures the elements perfectly.
So what should I do to only load all the scripts when my HTML has been rendered completely.
How to achieve the effect shown on the landing page of this website? https://monopo.london/ [closed]
I'm wondering how to replicate this effect on https://monopo.london/ where the mouseover interacts with the colours.
Thought it would be something like this https://tympanus.net/Development/FlowmapDeformation/index.html but it does not seem like it as in this case, it's a still image. In Monopo London, the mouse was interacting with the colours.
Please advise! T.T
How do I redirect any url under a folder, keeping the subfolders?
If I have example.com/example/ with subfolders (for example: example.com/example/test1/), how do I redirect from example.com/redirect/ to example.com/example/ so that example.com/redirect/test1/ will redirect to example.com/example/test1, without creating a subfolder under example.com/redirect/ for every subfolder under example.com/example/ using HTML?
Currently, I have under example.com/example/ the following index.html file:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta http-equiv="refresh" content="0; URL=https://example.com/example/">
<title></title>
</head>
<body>
</body>
</html>
I'm hosting the website via GitHub pages.
Cname and Dns Actions
I am trying to get how DNS works. I've seen some videos and schemas that explain how DN Servers work. But I didn't understand the role of the CNAME record. What happens when eventually my authoritative name server gives the exact IP address for the website I am searching for and what does CNAME do meanwhile? At my domain provider, it's standing for pointing 'www' subdomain to my Cname which is provided from my host server. (sm. like web-23242.hostsw.com). And also when I type this to the address bar there are not any results.So what does cname do inside these dns interactions?
How to close matplotlib output window in Replit?
Is there any way to close this output window that Replit uses to show the graphs of matplotlib? 
The left window causes my web application to get stuck. Is there any way to close it?
Laravel 8 development server stops working after 5 minutes
Laravel version 8.0 PHP version 7.4.25
when I run Laravel development server it stops after 300 seconds but the project works fine even after the error.
λ php artisan serve
Starting Laravel development server: http://127.0.0.1:8000
[Sun Oct 31 15:23:52 2021] PHP 7.4.25 Development Server (http://127.0.0.1:8000) started
PHP Fatal error: Maximum execution time of 300 seconds exceeded in F:\project\vendor\laravel\framework\src\Illuminate\Foundation\Console\ServeCommand.php on line 59
Symfony\Component\ErrorHandler\Error\FatalError
Maximum execution time of 300 seconds exceeded
at F:\project\vendor\laravel\framework\src\Illuminate\Foundation\Console\ServeCommand.php:59
55▕ : now()->addDays(30)->getTimestamp();
56▕
57▕ $process = $this->startProcess($hasEnvironment);
58▕
➜ 59▕ while ($process->isRunning()) {
60▕ if ($hasEnvironment) {
61▕ clearstatcache(false, $environmentFile);
62▕ }
63▕
Whoops\Exception\ErrorException
Maximum execution time of 300 seconds exceeded
Matplotlib causing stuck web server
I have created a web server application on Replit using flask and it needs to use matplotlib library. The problem is that it gets stuck every time the server starts. This seems to be solved by removing matplotlib from the code.
This is what I get on the console before it freezes:
Matplotlib created a temporary config/cache directory at /tmp/matplotlib-jvbhc0qv because the default path (/config/matplotlib) is not a writable directory; it is highly recommended to set the MPLCONFIGDIR environment variable to a writable directory, in particular to speed up the import of Matplotlib and to better support multiprocessing.
Python 3.8.2 (default, Feb 26 2020, 02:56:10)
* Serving Flask app 'app' (lazy loading)
* Environment: production
WARNING: This is a development server. Do not use it in a production deployment.
Use a production WSGI server instead.
* Debug mode: off
* Running on all addresses.
WARNING: This is a development server. Do not use it in a production deployment.
* Running on http://172.18.0.191:8080/ (Press CTRL+C to quit)
As you can see, it shows a screen when it's supposed to show the matplotlib output, but I don't need to show anything on the editor screen. I have also tried to change the backend of matplotlib but it doesn't work either.
This is the function that uses the library, it's only creating an image to send it to the client, it's not showing any graph on screen:
@app.route('/function', methods=['POST'])
def Function():
data = request.data.decode()
doc = nlp(data)
fig = plt.figure(figsize=(8, 8))
wc = WordCloud(background_color="white",
#max_words=350,
font_path='GELION-BOLD.TTF',
width=1000,
height=600,
).generate(doc.text)
plt.imshow(wc)
plt.axis("off")
buf = io.BytesIO()
fig.savefig(buf, format='png')
buf.seek(0)
string = base64.b64encode(buf.read())
uri = 'data:image/png;base64,' + urllib.parse.quote(string)
html = '<img src = "%s"/>' % uri
return html
The only way I managed to "solve" this is by creating a new Repl and transferring all the code, but this solution only works one time before it gets stuck again. Any solution would be very helpful.
FirebaseError: Firebase: No Firebase App '[DEFAULT]' has been created - call Firebase App.initializeApp() (app/no-app). {Flutter web}
**
FirebaseError: Firebase: No Firebase App '[DEFAULT]' has been created
- call Firebase App.initializeApp() (app/no-app).
**
For more than 7 days myself trying to solve my "flutter admin web app" problem. But I can't.
√ My firebase auth is: Anonymous √ Flutter (Channel beta, 2.7.0-3.1.pre √ Dart version 2.15 √ Android toolchain - develop for Android devices (Android SDK version 31.0.0) √ Chrome - develop for the web √ Android Studio (version 2020.3)
How can I solve the problem?
Please help me. Who knows, dear mentor.
index.html (file)
<!DOCTYPE html>
<html>
<head>
<!--
If you are serving your web app in a path other than the root, change the
href value below to reflect the base path you are serving from.
The path provided below has to start and end with a slash "/" in order for
it to work correctly.
For more details:
* https://developer.mozilla.org/en-US/docs/Web/HTML/Element/base
-->
<base href="/">
<meta charset="UTF-8">
<meta content="IE=Edge" http-equiv="X-UA-Compatible">
<meta name="description" content="A new Flutter project.">
<!-- iOS meta tags & icons -->
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="apple-mobile-web-app-title" content="grocery_admin_app_flutter">
<link rel="apple-touch-icon" href="icons/Icon-192.png">
<title>grocery_admin_app_flutter</title>
<link rel="manifest" href="manifest.json">
</head>
<body>
<!-- This script installs service_worker.js to provide PWA functionality to
application. For more information, see:
https://developers.google.com/web/fundamentals/primers/service-workers -->
<!-- The core Firebase JS SDK is always required and must be listed first -->
<script src="https://www.gstatic.com/firebasejs/8.6.1/firebase-app.js"></script>
<script src="https://www.gstatic.com/firebasejs/8.6.1/firebase-analytics.js"></script>
<script src="https://www.gstatic.com/firebasejs/8.6.1/firebase-firestore.js"></script>
<script src="https://www.gstatic.com/firebasejs/8.6.1/firebase-auth.js"></script>
<script src="https://www.gstatic.com/firebasejs/8.6.1/firebase-storage.js"></script>
<script type="text/javascript">
let useHtml = // ...
if(useHtml) {
window.flutterWebRenderer = "html";
} else {
window.flutterWebRenderer = "canvaskit";
}
</script>
<script src="main.dart.js" type="application/javascript"></script>
<script>
// Your web app's Firebase configuration
// For Firebase JS SDK v7.20.0 and later, measurementId is optional
const firebaseConfig = {
apiKey: "AIzaSyAgoXpOjiZntQBEMqt7ZDrcFpLRmH1ZwCM",
authDomain: "jaituncshop.firebaseapp.com",
databaseURL: "https://jaituncshop-default-rtdb.firebaseio.com",
projectId: "jaituncshop",
storageBucket: "jaituncshop.appspot.com",
messagingSenderId: "338592147861",
appId: "1:338592147861:web:14315ce1d827ad50c1ee9c",
measurementId: "G-TG69GZ1VSX"
};
// Initialize Firebase
const app = initializeApp(firebaseConfig);
const analytics = getAnalytics(app);
</script>
<script>
var serviceWorkerVersion = null;
var scriptLoaded = false;
function loadMainDartJs() {
if (scriptLoaded) {
return;
}
scriptLoaded = true;
var scriptTag = document.createElement('script');
scriptTag.src = 'main.dart.js';
scriptTag.type = 'application/javascript';
document.body.append(scriptTag);
}
if ('serviceWorker' in navigator) {
// Service workers are supported. Use them.
window.addEventListener('load', function () {
// Wait for registration to finish before dropping the <script> tag.
// Otherwise, the browser will load the script multiple times,
// potentially different versions.
var serviceWorkerUrl = 'flutter_service_worker.js?v=' + serviceWorkerVersion;
navigator.serviceWorker.register(serviceWorkerUrl)
.then((reg) => {
function waitForActivation(serviceWorker) {
serviceWorker.addEventListener('statechange', () => {
if (serviceWorker.state == 'activated') {
console.log('Installed new service worker.');
loadMainDartJs();
}
});
}
if (!reg.active && (reg.installing || reg.waiting)) {
// No active web worker and we have installed or are installing
// one for the first time. Simply wait for it to activate.
waitForActivation(reg.installing ?? reg.waiting);
} else if (!reg.active.scriptURL.endsWith(serviceWorkerVersion)) {
// When the app updates the serviceWorkerVersion changes, so we
// need to ask the service worker to update.
console.log('New service worker available.');
reg.update();
waitForActivation(reg.installing);
} else {
// Existing service worker is still good.
console.log('Loading app from service worker.');
loadMainDartJs();
}
});
// If service worker doesn't succeed in a reasonable amount of time,
// fallback to plaint <script> tag.
setTimeout(() => {
if (!scriptLoaded) {
console.warn(
'Failed to load app from service worker. Falling back to plain <script> tag.',
);
loadMainDartJs();
}
}, 4000);
});
} else {
// Service workers not supported. Just drop the <script> tag.
loadMainDartJs();
}
</script>
</body>
</html>
Why Did a Website Open "Key Chain" on Android
I could just be paranoid? But why did a website open a tab with the "Key Chain" name on my android? It just flashed on the screen then immediately disappeared. Should I be worried about something?
How to Navigate to Website from App in flutter?
I want to navigate to playstore when user click on button Like
ElevatedButton(onPressed:(){Navigtor.of(context)},child:Text("Navigate to website"),)
I don't want to use any plugin like webview_flutter.
I don't Know how to achieve this. If you know the solution then answer this question
samedi 30 octobre 2021
Flutter Web : "Should never encounter KeyData when transitMode is rawKeyData."
When I run my project on web the Exception message and stack trace was
"Should never encounter KeyData when transitMode is rawKeyData."
at Object.throw_ [as throw] (http://localhost:2621/dart_sdk.js:5061:11)
at Object.assertFailed (http://localhost:2621/dart_sdk.js:4986:15)
at hardware_keyboard.KeyEventManager.new.handleKeyData (http://localhost:2621/packages/flutter/src/services/restoration.dart.lib.js:5334:28)
at http://localhost:2621/dart_sdk.js:160131:47
at Object.invoke (http://localhost:2621/dart_sdk.js:179656:7)
at _engine.EnginePlatformDispatcher.__.invokeOnKeyData (http://localhost:2621/dart_sdk.js:160131:17)
at _engine.KeyboardBinding.__.[_onKeyData] (http://localhost:2621/dart_sdk.js:158922:49)
at _engine.KeyboardConverter.new.handleEvent (http://localhost:2621/dart_sdk.js:159210:16)
at http://localhost:2621/dart_sdk.js:158929:74
at loggedHandler (http://localhost:2621/dart_sdk.js:158906:43)
Error: Assertion failed: file:///E:/flutter_windows_2.5.2-stable/flutter/packages/flutter/lib/src/services/hardware_keyboard.dart:787:16
C++ Back end web development
This my first post and I'm a new bie on the site. And a new bie in programming. What are the necessary things to have for a c++ back end web development. Thank you
Is possible for a Website to know BTS of my mobile connection?
can a website know the BTS address (gNodeB or eNodeB) of the users connected to it?
Or, is it possible to know that an amount of users are connected from the same place through mobile connections?
BeautifulSoup children() vs descendants()
I read a book that has the following:
from urllib.request import urlopen
from bs4 import BeautifulSoup
html = urlopen('https://ift.tt/3CuSdBb)
bs = BeautifulSoup(html, 'html.parser')
for child in bs.find('table',{'id':'giftList'}).children:
print(child)
This code prints the list of product rows in the giftList table, including the initial row of column labels. If you were to write it using the descendants() function instead of the children() function, about two dozen tags would be found within the table and printed, including img tags, span tags, and individual td tags.
I tested it and I did not see the two outputs had difference when using .children or .descendants. Can anyone please tell me what exactly it will print when using .children and using .descendants.
I need a simple java web app messaging api [closed]
I am a student working on an application that I need to implement user-to-user messaging in. I would eventually like to include the ability for users to create events that can be RSVPed to but that may be another issue. I'm having a difficult time and am wondering what you all think would be the simplest and most achievable implementation for a fairly green app development student. I am currently using Spring Java/Thymeleaf/PostgreSQL. Thanks!
CSS table right spacing
The First Picture is good.
But in Second Picture, when I changed the resolution and the overflow-x shows, the spacing between table and div at the right is gone. What do you think is the solution here?
add class to element in viewport
I have five sections on my page, and I am trying to add class "active" to the section in the view port. I tried this code but it is not working properly. the code saves all elements with tag name "section" in a node list then created an array of this list, I looped over the array and added an event listener for each element, then I tested if the element is in the viewport is so I add the class else I remove the class. the problem is once the page is scrolled all the five sections will have the class "active" which means that multiple elements have the class "active" at the same time even though only one section is viewed in the port and when I keep on scrolling down the sections that are moved upward out of the viewport have their class "active" removed. how can i have one element with the class "active"image of code at a time?
//values of viewport
const viewWidth = document.documentElement.clientWidth;
const viewHeight = document.documentElement.clientHeight;
//set class active to section in viewport
function sectionInView(x) {
for (let i = 0; i in x; i++) {
document.addEventListener("scroll", function () {
let el = x[i].getBoundingClientRect();
if (el.top >= 0 && el.left >= 0 && el.bottom <= viewHeight && el.right <= viewWidth) {
x[i].setAttribute("class", "active your-active-class");
}
else {
x[i].removeAttribute("class", "active your-active-class");
}
});
}
}
sectionInView(sectionListArray);
I want to show webpage when user type anything after / like domain.com/dcvjhgksuyfgku
Hello pro coders how can i show a website when user type anything after domain like https://example.com/ajhfdvckjhv Is that possible? Also i want to redirect users to my app(made with appinventor)
How to batch process web queries which are between 500ms in Python
I have a model deployed as a service and want to process queries during a fix period such as 500ms and send them in batch to my model then return the results back to all clients. How to realize it in Python? Use Flask or Sanic or message queue?
TypeError: .map is not a function don't understand what's wrong
I don't understand why this component doesn't work Here is link to img "because somehow i can't post image directly [1]: https://i.stack.imgur.com/Ax7im.png Thank's for any help Here you have code:
import React from 'react';
import ReactDOM from 'react-dom';
import Postitem from "./Postitem";
const Postlist=(post,title)=>{
return (
<div>
<h1 style=>{title}</h1>
{post.map((post) =>
<Postitem post={post} key={post.id}/>)};
</div>
)};
export default Postlist;
Separate HTTP requests for each dropdown or a single request for a fat FormViewModel?
If the view which serves for creating an item contains some dropboxes / checkboxes / whatever with values from the server, should it send separate requests for filling up those controls with values (one request per each collection of data) or it is better to have a single api endpoint that returns all of the necessary data for filling up the form on front-end?
For the sake of simplicity, I've simulated here an example: Say we're building an app for a car servicing company where clients can make appointments:
Should the front-end app make 2 get requests to api/models and api/services, or these collections can be returned from the server in a single response (from api/appointments/createformdata), What are the best practices regarding to this?
Thank you in advance.
HTML list items get hidden by scroll function instgram
I am trying to get the list of all Instagram story viewers names, The problem I'm having is that I can get all the elements in that list, How can I get all the list not only the small part that I am viewing? I am using js to get the items using the DOM to get all the profile pictures of the accounts in the list
var x = document.getElementsByClassName("_6q-tv");
x.length
I am getting The length as 17 while the story viewers are 180
I tried to do it in beautiful soup (python) but the same result was given how can I get all of them?
ASP.NET Core Project Ideas [closed]
I'm a student as a computer programming. That's my last year in university and I need to do graduate project with my school friend. I did Information Security Management System project with a Senior Developer who working in company and I worked this project on back and front end. To get to the main point I want to web project in asp.net core and I can't find project ideas. Please you guys I want to hear your cool project ideas. Thank You.
a secure of phoenix Plug.Session set value on runtime
I want to set value of secure on runtime. But it is set value on compile time. I don’t know how to do that. My env is elixir 12, erlang 24 Plz help me
plug Plug.Session, store: :cookie, key: "_key", signing_salt: "KahwH24", max_age: 60 * 60, secure: System.get_env("PLUG_SESSION_SECURE", "true") == "true"
How to scale an element in relation to itself instead of to the parent element?
Currently, I'm trying to make a tooltip of an image in my navbar and I can't figure out how to center it. Essentially, I have a div in mynavbar and I have tooltip that comes out when hovered. I want the tooltip to be positioned such that the center of the tooltip aligns with the center of the image in the div. The problem is I can't use 'left:50%' since it refers to 50% of the parent navbars width which is 100%. This positions the tooltip in the middle of the entire screen instead of the middle of the div. Is there any way I can prevent it from referring to the parent width and instead have it be 50% of its own width? I've added my code here and also in a jsfiddle
*{
margin: 0;
padding: 0;
border: none;
box-sizing: border-box;
text-decoration: none;
list-style: none;
}
body{
background-color:rgb(80,155,192);
}
header{
display: grid;
grid-template-columns: 25% 20% 5% 5% 20% 25%;
/* 1 2 3 4 5 6*/
justify-content: center;
align-items: center;
width: 100%;
background-color: white;
position: sticky;
top: 0;
z-index:1;
}
header h1{
grid-column: 1;
margin-left: 5%;
padding:10px;
font-size: 40px;
font-weight: 500;
color:rgb(80,155,192);
cursor: pointer;
transition: color 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
}
header h1:hover{
color: black;
}
header h1 a:visited{
color:rgb(80,155,192);
}
.water-container{
grid-column: 3;
background:gray;
}
.water-container:before,
.water-container:after{
position: absolute;
bottom: -0.25rem;
left: 50%;
}
.water-container:before{
content: attr(title);
color:white;
padding:0.5rem;
border-radius: 0.3rem;
background: #333;
}
.water-icon{
display: block;
margin:auto;
width:3rem;
transition: all 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
transform-origin: center;
}
.water-icon:hover{
transform: scale(1.2);
}
.fairy-container{
grid-column: 4;
}
.fairy-container:hover:after{
content: attr(data-tooltip);
}
.fairy-icon{
display: block;
margin:auto;
width:3rem;
transition: all 0.3s cubic-bezier(0.165, 0.84, 0.44, 1);
transform-origin: center;
}
.fairy-icon:hover{
transform: scale(1.2);
}
nav {
grid-column: 6;
}
.nav_links li{
display: inline-block;
margin-inline: 30px;
}
.nav_links li a{
display: inline-flex;
justify-content: center;
align-items: center;
font-size: 15px;
width: 100px;
height: 40px;
border-radius: 50px;
background-color: rgb(80,155,192);
color: white;
transition: all 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);
}
.nav_links li a:hover{
background-color: rgb(60, 136, 173);
}<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<header>
<h1><a href="main.html">asdasd</a></h1>
<div class="water-container" title="water">
<img src="graphics/water.png" class="water-icon" alt="water icon">
</div>
<div class="fairy-container" data-tooltip="fairy">
<img src="graphics/fairy.png" class="fairy-icon" alt="fairy icon">
</div>
<nav>
<ul class="nav_links">
<li><a href="">Why?</a></li>
<li><a href="">Contact</a></li>
</ul>
</nav>
</header>
</body>
</html>Btw Im aware of the other issues in the code, I can fix them. I'm just confused about this one thing that I dont know how to fix. Thanks!
How to bring mobile navigation bar forward in front of pages?
I'm using the Patricia Lite WordPress theme. The mobile navigation toggle goes behind some pages instead of in front.
Changed time zone in request
I'm sending moment object in request, but unfortunately the date is changing. For example when I choosed some date and I write to console, the date is ok, but in the request time is few hour early what is change the date.
console: Fri Oct 01 2021 00:00:00 GMT+0200 - ok, In sent json: "2021-09-30T22:00:00.000Z" - wrong
Why it happens and how to fix it.
Redirect URL to other URL on local computer
I mean if I go on google.com, then I get redirected to amazon.com
Is there any way to do that on my local computer with chrome
vendredi 29 octobre 2021
How to add other website URL in Mongo DB and use it in Website code for redirection?
We are creating a site in which we want if a user login he goes to a page where there is button to download pdf. Pdf file for every user is different that's why we want to put URLs of PDFs in database and use it in website code. We are using MONGODB Nodejs , HTML/CSS
Javascript Html [closed]
How do I have it where when I have something in my input box I can then click a button and the javascript will create a new p tag and it will display the text from my input box in the p tag java script made but if I decide to add another comment it will create another p tag and display again kind of like a social media comment section like YouTube or ticktock.
AWS Load Balancer Authentication with Cognito Testing
I'd like to use an Application Load Balancer (ALB) to authenticate requests with Cognito to my node express back-end. After authenticating, the ALB maintains session with a session cookie, and will forward a few headers to the back-end in form x-amzn-oidc-* (e.g. x-amzn-oidc-accesstoken).
So how do I develop and test token signature verification locally?
How to measure on which posts the user spent more time while scrolling through feeds
** Note: This is a theoretical problem more than a language specific one **
-
How do we track the analytics of user activity upon scrolling on an app like Instagram to identify where and on what type of posts the user spent most times?
-
How do you differentiate the scroll pause vs someone who is just tired and stopped scrolling to start again?
How does a hosting platform submit all of their sites to search engines?
Google's webmaster tools help says that platforms like Wordpress (and other widely used platforms) "probably already" submit your site to google for spidering.
Is this actually true? Is there an API or way I can have my home grown platform to submit these sites to google? I don't want my clients to have to sign up for webmaster tools on Google, Bing, etc, just to start being spidered.
Different result from web browser [closed]
I have a question if you make me any advice , whenever I try a web site via web browser ( I can't write the name here) ....&list=3 , I see the 3rd page of list normally however I got same list even if I try for different pages , only one and same list when I use php python js, I use headers but no success, what is solution can you help me please ? I use beautiful soup and detailed user agent
Creating seperate weblinks for QA and dev region in SNOWFLAKE
I am not very sure if there is possibility in SNOWFLAKE to create separate weblinks for QA and dev region.
Now we have one common link to access SNOWFLAKE in our company and we have QA and Dev databases built in that, I was just wondering if there is a option to create seperate web links for, one link for QA and one link for Dev.
Flutter WebView loading different version of page?
I am loading a webview in flutter using webview_flutter plugin from pub.dev For some urls it's loading a different (old?) version of the website.
How it should look (and does look on mobile browsers like Chrome and Safari): Browser(desired look)
How it does look in the Flutter App: Flutter WebView (current look)
Most notably the letters are capital (they used to be capital in an old version of the webpage) but there are some other minor differences too. I realise the bug here might be from the web side and not the Flutter side, I would just like to know what it is so that I can ask the Web team to handle it accordingly (I am a student and very new to all of this) Thank you. Code for WebView:
WebView(
initialUrl: url,
javascriptMode: JavascriptMode.unrestricted,
onPageFinished: (c) {
setState(() {
_isLoading = false;
});
},
),
My website keeps loading indefinitely after 3 operations
i can't understand why my site after 3 operations goes into a literally infinite loop. i am using eclipse and i am hosting the server with tomcat, as database i use workbench. The server initially does not give errors, or so it seems for the first two operations, but then as soon as I perform the third operation the site does not respond and goes into infinite upload (I attach photos and code).
I don't think it's a code problem, maybe it will be Tomcat max cache? I've been banging my head for more than 3 days but I just can't solve it, finally I don't have any kind of error inside the Eclipse console, and the only way to get my site up and running is to totally restart the tomcat server.
This is my code: https://github.com/Fatted/Olysmart_TSW2021 (download the zip,databse is included)
I already thank those who will help me or who at least had some time to read this post, thanks!
How to redirect a URL to an IP
I want to know if there is any way to redirect an URL to an internal IP on fritzbox?
Example: I type in the adressbar: https://www.google.com and my router automaticly redirects me to 192.0.0.1
How to detect/convert a Multiframe image to single frame image in java/javascript?
1 of our external API's doesn't allow Multiframe images.
So, There is a need to detect and convert a multiframe image to single frame image.
Can anyone help?
Thanks, Askanode :)
Looking for very dynamic user driven web table/grid for MVC custom columns
Client is looking for the most dynamic user customisable table/grid (where we display numbers like invoice liens).
Each user should be able to move columns around, hide/show columns, filter, sort, maybe pivot grouping (also make coffee). And then save that configuration for next time they get to that grid. And there are a number of these grids in the system.
The table/grid also has edit cells, right-mouse-bottom events, move rows.
System is web MVC6 (ASP.Net c#) with razor tables setting. A number of JScipt/Ajax had to be added also.
School project to make a website that should show images from a database that is updated every few minutes [closed]
So I have a school project in collaboration with a company that makes space hardware. The very same company wants us to make from scratch a system that would take pictures of their testing bench every few minutes and then make them available on a locally hosted website. The problem is that we have 0 to no knowledge on coding, databases, etc... So here I am asking you guys how this project could be done, and what I should look into to make this work
Jquery is not defined when remove "text/javascript" attribute
Scenario that works:
-
I have an
APP_FRAMEWORK.JSfile that was generated through aWEBPACK, includingBOOTSTRAP AND JQUERYinside it.<script type="text/javascript" src="" defer></script> @if(!empty($assets['js'])) @foreach ($assets['js'] as $js) <script type="text/javascript" src=""></script> @endforeach @endif
If I load the page as in the example, it works perfectly, without any errors in the scripts that are loaded inside that loop below.
My question:
- Why, if I remove the "text/javascript" when loading the
MAIN SCRIPT (APP_FRAMEWORK.JS)the$ is not definederror starts to appear? - Remembering that this
TYPEis no longer mandatory, scripts are loaded in the correct order and there is aDEFER!!!
Javascript and CSS not working after uploading the website online but they are working fine locally
Here is the site in question http://www.rfindings.net/ I have uploaded the code to github - https://github.com/Shaivik7/rfindings
Now the home page has 2 images that should be switching every 4 secs which is not happening online but working fine offline. If you see any missing semicolons I have fixed them and tried again but nothing changes.
And for CSS part I have wrote the media query according to resized browser but the site looks completely different on mobile, I used media query for anything less than 768px but still on mobile it looks completely different.
I am beginner so I hope my code isn't too messy if it is I apologize in advance. I am hosting this site at namecheap If you have to time please take a look.. Thanks
Hidden event from web page
I'm trying to automate some actions I've access to from a webpage, to overcome some API limitations (meaning: an API exists for most of the actions, but for a specific one I have the rights to, I need to manually go to the page, make a menu pop up and click on it). When I click on the command, nothing appears in the Network tab of dev tools of Chrome. Nothing is logged by Fiddler (except tracking info). Are there some special ways of communication that are not seen by dev tools ? What am I missing ?
Thank you in advance
Adding scaffolding login register in ASP.NET Core broke my project
I can't add scaffolding identity register login.
I had no errors before adding these, but suddenly, the project finds tens of errors after trying to add identity to the project.
Example of error:
Error CS1061
'EntityTypeBuilder' does not contain a definition for 'Navigation' and no accessible extension method 'Navigation' accepting a first argument of type 'EntityTypeBuilder' could be found (are you missing a using directive or an assembly reference?)
How detect how much a server support connection
I have a downloader program in MFC/Win32 that downloads a file at multi-connection but on some sites when connection count is 8 the server returns 503 error but when I decrease connection count to 5 download works fine? Also I set INTERNET_OPTION_MAX_CONNS_PER_SERVER and 1_0 server value to 64 How to solve this problem? How detect the server supported connection count? Thanks
Browser tab title with Angular when using window.open(...)
In the code behind, I open a new browser tab (window) with a PDF as content, from data as blob from the server. It works, a new tab opens with the document, but the title of the tab of the browser is some hex code. Could dynamically I change this browser tab title? "Document" for example?
Here is the code I use (sorry, could not do a StackBlitz sample as the data comes from a server):
const file = new Blob([data], {type:'application/pdf'});
const fileURL = URL.createObjectURL(file);
window.open(fileURL, '_blank');
And here, how my browser tab looks like:
jeudi 28 octobre 2021
Add a post id to a comment PHP
Newbie there, hello I create a blog and need to associate posts/comments but it doesn't work because article_id stay at 0. comments table In Commentary class:
public function addComm($data){
$this->dbcomm->query('INSERT INTO comments (user_id, article_id, commentbody)
VALUES(:user_id, :article_id, :commentbody)');
//Bind values
$this->dbcomm->bind(':user_id', $data['user_id']);
$this->dbcomm->bind(':article_id', $data['article_id']);
$this->dbcomm->bind(':commentbody', $data['commentbody']);
// Execute
if($this->dbcomm->execute()){
return true;
} else {
return false;
}
}
And function :
public function comment(){
if($_SERVER['REQUEST_METHOD'] == 'POST'){
// Sanitize POST array
$_POST = filter_input_array(INPUT_POST, FILTER_SANITIZE_STRING);
$data = [
'commentbody' => trim($_POST['commentbody']),
'user_id' => $_SESSION['user_id'],
'commentbody_err' => '',
'article_id' => '',
];
//validate title
if(empty($data['commentbody'])){
$data['commentbody_err'] = 'Svp entrer un commentaire';
}
//Make sure no errors
if(empty($data['commentbody_err'])){
//validated
if($this->commentModel->addComm($data)){
flash('post_message', 'Commentaire ajouté');
redirect('posts/');
} else {
die("Quelque chose n'est pas bon");
}
} else {
//load view with errors
$this->view('posts/comment', $data);
}
} else {
$data = [
'title' => '',
'commentbody' => '',
];
$this->view('posts/comment', $data);
}
}
If I type : 'article_id' => $post->id, it doesn't works.. Can you help me guys please
React Auth - API is being printed on Console with Firebase 9 [duplicate]
hey there i have encouter a problem with my signup form. everything works perfectly but when i try to sign up with an existing email i can see error coming out on console and there my api key is prited.
how can i get rid of this thing bcz api key is sensitive..
here is the screen for the code i wrote for submitHandler. i tried without async using .then.catch but the result is same 
Private DNS domain name [closed]
I am working on setting up my private DNS domain name (eg. ".sample") and hosting it on EC2 instance.
From my local machine, if I configure my DNS server to query my EC2 instance first for the DNS mapping, then I can resolve "web1.sample" to the IP address and I can access it using browser.
Now I would like to expose this "web1.sample" to the public internet, but seems like ".sample" need to be approved/registered/provided by a Internet Authority. Which I don't want to do so.
I can see another website that can have their own private domain "https://www.home.saxo/" How can I do the same as them?
Web interface for database [closed]
I kinda have a weird question. See, I have this framework that I've developed which runs in any database. The framework needs to be populated by business-facing users. I'd rather not have to build and maintain a custom website but rather have some app read the schema of my framework from the database and generate a web interface that enables users to interface with the database.
Does anything like this exist?
Advice on a Converter [closed]
I'm a beginner at all of this so I need some help on my project. I am planning to make a converter that converts numbers into images. I already have the images that will be converted. So if I type "7" onto the field, an image that has 7 will get pulled. I am not sure how to do it. I have some experience in HTML, CSS, JavaScript and Python, will I have to use another language or what can I do?
Some help would be appreciated.
edit 1: I already know how to make do the large part of it, I just don't know how to make it so that when there's an input, the output would be a designated image.
Ag-grid row group based on two columns?
I have some rowdata with the following fields:
- transaction id (unique)
- price
- contract start
- contract end
Now my use case is, I want the top level row group based on active date. Given any calendar days, the contract is consider active on a particular date if it starts on or on that calendar day and ends after that calendar date.
The calendar date will be a user Input date. So they selected jan 1st to 2nd. I would want something like
- 01/01/2021 (the row group)
- id2/30/2020-12-30/2021-02-01
- id5/50/2021-01-01/2022-01-02
- 01/02/2021 (another row group)
- id2/30/2020-12-30/2021-02-01 (because this is still active for this calendar date)
- id10/100/2021-01-02/2021-01-10
It is also possible that the transaction has no end date (undefined). That just means the contract should be included on the row group of every calendar date from the start of the transaction.
How could I achieve this with ag grid?
Is there a way to limit max scrolling speed of Google Chrome on Android?
My web app written in React has an infinite scrolling component, when testing 2000 elements I discovered a visual bug which makes animations look choppy/laggy on Android devices.
This happens when you try to scroll to the end fast.
I tested using Google Chrome browser on Android and iOS, trying to reach the end of list as fast as possible:
- On iOS the max scrolling speed is much lower and it takes 44 seconds to reach the end of the list, but all of the animations look very smooth.
- On Android it takes 17 seconds to reach the end but the animation looks terrible.
If I could somehow limit max scrolling speed of my web app OR just 1 specific scroller inside a div then that will solve my issue.
Is this there a way to achieve this?
I'm building a website where users can download digit assets and I wanna know if anyone can throw some light to speed up the load time in Django
Hello guys please I would really appreciate it if someone could help me out with this website problem I am building a website where users can download digital assets from using Django, for example download website templates, graphics templates and all that. But now the issue is that when it's already hosted it takes a whole lot of time loading up because I think the files are slowing down the website and I don't really know the perfect way to fix this because I'm still kind of a beginner in Django and any help will be really appreciated.
Authentication middleware is given still giving CORS error
I am making an Jwt applicaion using go react and mongodb application is backend is working absolutely fine when I am trying to connect and perform POST and GET operation using Postmaster. But when I am doing the same thing from front end react it's giving me error saying CORS error request forbidden, I am giving you the middle ware code as well as the git lab link please go to gitlab and see my code where I done this mistake and please provide me a solution
[GitLab full code link]
https://gitlab.com/RajrupDasid/golang-user-authentication/-/tree/master
func Authentication() gin.HandlerFunc {
return func(c *gin.Context) {
clientToken := c.Request.Header.Get("token")
if clientToken == "" {
c.JSON(http.StatusInternalServerError, gin.H{"error": fmt.Sprintf("No Authorization header provided")})
c.Abort()
return
}
claims, err := helper.ValidateToken(clientToken)
if err != "" {
c.JSON(http.StatusInternalServerError, gin.H{"error": err})
c.Abort()
return
}
c.Set("email", claims.Email)
c.Set("first_name", claims.First_name)
c.Set("last_name", claims.Last_name)
c.Set("uid", claims.Uid)
c.Next()
}
}
func CORSMiddleware() gin.HandlerFunc {
return func(c *gin.Context) {
c.Writer.Header().Set("Content-Type", "application/json")
c.Writer.Header().Set("Access-Control-Allow-Origin", "*")
c.Writer.Header().Set("Access-Control-Allow-Methods", "POST, GET, OPTIONS, PUT, DELETE")
c.Writer.Header().Set("Access-Control-Allow-Headers", "Accept, Content-Type, Content-Length, Accept-Encoding, X-CSRF-Token, Authorization")
}
}
Spring boot Post calls are not working with NGINX
I am running Spring boot application on port 9077.All API calls(GET,POST..) are working fine when I use the IP address.But only get calls are working when I use the domain name. This is my nginx config:
server {
listen 80;
listen [::]:80;
server_name example.com;
location / {
proxy_pass http://localhost:9077/;
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection 'upgrade';
proxy_set_header Host $host;
proxy_cache_bypass $http_upgrade;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Proto $scheme;
proxy_set_header X-Forwarded-Port $server_port;
}
error_page 404 =200 $uri;
}
Why have a domain landingpage.homeurl.com over homeurl.com/landing page?
What is the reasoning for doing pages like
Landingpage.HomeURL.com
over
HomeURL.com/landingpage
Just wondering the thought process
Thank you
How to prevent custom.css from interfering with lighthouse audits?
I am trying to optimize the core web vitals of my site, and the custom.css file is affecting the latency (or at least I think so), I understand that this is a file to customize the appearance of the sites, however I do not use it. Is there a way to remove it, block it, or do something so that it doesn't interfere with the lighthouse audits? 
What does the content in whatsapp web message's data-id's mean?
I'm trying to understand what exactly is the content of the data-id inside the <tabindex> on the whatsapp web messages/notifications.
<div tabindex="0" class="_2wUmf V-zSs focusable-list-item" data-id="false_55xxxxxxxxxx2-1635363427@g.us_3A0955D4295AF8A379C9_55xxxxxxxxxx6@c.us">
As you can see, I figured that the censored bits are phone numbers. I also figured that true means that it's comming from me and false if it's someone else's message. Next there is a time stamp, the @g.us means that it's group message... But I can't find anywhere what does that big hash means. It keeps changing on every message, so it's not a user id. If it's not a whatsapp secret thing, can someone tell me what it is?
How to display my react application as desktop view on mobile?
I know I can use media query in order to make the design responsive. but I do not want to do that now. what I would like to do is when the user load the app on mobile, my react app detects that and display the app as desktop view on mobile.
wordpress/elementor - hamburger drop down menu not showing
I have built a wordpress site today, including a hamburger drop down menu. Unfortunately, this does not unfold and the contents of the menu are not visible. Who has an idea why the menu is invisible and how to solve this?
URL: https://we-shair.eu/
Many greetings and thanks in advance TOKI
How to continuously manipulate other website data?
I have used JS injector extensions on chrome to manipulate data on other website ( to see things in the way I want it to be ) but this method doesn't work on websites where the data is continuously changing.
For example, lets say I open Yahoo Finance where stock data is displayed live. I want to manipulate that data, meaning whatever live data is being displayed I want to multiply 100 to them and see that happening live and continuously. Is there any way to apply JS injection ( onchange ) kind of function to detect change and multiply 100x right away.
Parse error: syntax error, unexpected 'POST' (T_STRING), expecting ',' or ';' in C:\xampp\htdocs\login.php on line 175
I'm trying to convert HTML to PHP and I got this error. This is my code. Error in the first line
echo "<h2>Welcome to INTI Shopping Website</h2>n";
echo " <form method="POST" action="#">
echo "<div class="imgcontainer">n";
echo "<img src="avatar.png" alt="Avatar" class="avatar">n";
echo "</div>n";
echo "<div class="container">n";
echo "<label for="uname"><b>Username</b></label>n";
echo "<input type="text" placeholder="Enter Username" name="username" required>n";
echo "<label for="psw"><b>Password</b></label>n";
echo "<input type="password" placeholder="Enter Password" name="password" required>n";
echo "<button type="submit">Login</button>n";
echo "<label>n";
echo " <input type="checkbox" checked="checked" name="remember"> Remember me </label>n";
echo "</div>n";
echo "</form> n";
Google Drive video embed on website, pc and andorid can play the video , iplone cannot play the video
I use Google Drive video to embed on website. I can play the mp4 video on pc and andorid phone. But I cannot play the video on iPhone. I don't know why. Shall I convert the mp4 video to other format and code to be suitable for iphone? Can anyone help? Many Thanks!
Cognito User Pools by Environment
What's the best practice for Cognito User Pools across environments like dev->prod? Should I have separate User Pools for my development environments (dev, test) and my production environment?
How to solve to solve Drop down was not selected instead backgroud html editor was responding in flutter?
[enter image description here][1]
Container( height: 40, width: width * 0.57, child: DropdownSearch(
dropDownButton: const Icon(
Icons.arrow_drop_down,
size: 20,
color: Color.fromRGBO(155, 155, 155, 1),
),
mode: Mode.MENU,
showAsSuffixIcons: true,
dropdownSearchDecoration: underlineDecoration,
showSelectedItem: true,
items: DataList,
showClearButton: false,
onChanged: setselected,
selectedItem: this.defaultTemplateOption,
),
)
HtmlEditor( height: height * 0.45, controller: html_editor_controller, hint: "Enter the text here", toolbar: [ Style(), Font(buttons: [ FontButtons.bold, FontButtons.underline, FontButtons.clear ]), ColorBar(buttons: [ColorButtons.color]), Paragraph(buttons: [ ParagraphButtons.ul, ParagraphButtons.ol, ParagraphButtons.paragraph ]), Insert(buttons: [ InsertButtons.link, InsertButtons.picture, InsertButtons.video, InsertButtons.table ]), Misc(buttons: [ MiscButtons.fullscreen, MiscButtons.codeview, MiscButtons.help ]) ], callbacks: Callbacks( onEnter: () { print('enter/return pressed'); }, onFocus: () { print('editor focused'); }, onBlur: () { print('editor unfocused'); }, onBlurCodeview: () { print('codeview either focused or unfocused'); }, onKeyDown: (int keyCode) { print('$keyCode key downed'); print( 'current character count: ${html_editor_controller}'); }, onKeyUp: (int keyCode) { print('$keyCode key released'); }, onPaste: () { print('pasted into editor'); }, ), plugins: [], ) [1]: https://i.stack.imgur.com/1w5rq.png
Rewrite this Firebase Web SDK Version 8 syntax into Version 9
I have a problem with Firebase in my React Native app. I've found a quick fix online, but it's written in Firebase Web version 8 syntax:
firebase.firestore().settings({ experimentalForceLongPolling: true, merge: true });
How can I rewrite it in Version 9 syntax?
why is there suddenly a bot form on my website?
I just created a subdomain a few days ago, and now there's a 'bot verification' thing on my website, I didn't add that. I m also using c panel for my website but I found nothing related to it.
People who understand Zegashop, it is urgent
I want to create an attribute and attribute family on my site created through Zegashop, who can help me?
How do I get EventSource.onmessage to work?
How do I get EventSource.onmessage to work?
Here is my subscribe and pushevent code:
public SseEmitter subscribe() throws Exception {
SseEmitter emitter = new SseEmitter(1800000L);
emitters.add(emitter);
emitter.onCompletion(() -> {
synchronized (emitters) {
emitters.remove(emitter);
}
});
emitter.onTimeout(() -> {
emitter.complete();
emitters.remove(emitter);
});
return emitter;
}
@Async
public void pushEventMap(Map<String, Object> pushMap) throws IOException {
List<SseEmitter> deadEmitters = new ArrayList<>();
HashMap<String,Object> map = (HashMap<String,Object>) pushMap;
emitters.forEach(emitter -> {
try {
emitter.send(SseEmitter.event().name("myEvent").data(map));
} catch (Exception e) {
emitter.completeWithError(e);
logger_error.error("pushEvent Exception:" + e);
deadEmitters.add(emitter);
}
});
emitters.removeAll(deadEmitters);
}
The controller for the above service is:
@RequestMapping(value = "/subscribe", produces = "text/event-stream")
public ResponseEntity<SseEmitter> subscribe() throws Exception {
final SseEmitter emitter = eventService.subscribe();
return new ResponseEntity<>(emitter, HttpStatus.OK);
}
@RequestMapping(value = "/publish")
public void publish() throws IOException {
eventService.pushEventMap(pushMap);
}
I want the client to receive the data of event push through js.
const eventInit = () => {
console.log("eventInit called");
const url = 'http://localhost:8080/itf/subscribe';
const eventSource = new EventSource(url);
var httpRequest = new XMLHttpRequest();
eventSource.onmessage = (event) => {
const data = JSON.parse(event.data);
console.log('===');
console.log(data);
}
eventSource.onopen = (event) => {
console.log('sse open');
console.log(event);
}
eventSource.onerror = (event) => {
if (event.readyState == EventSource.CLOSED) {
console.log('sse close');
} else {
console.log("onerror", e);
}
}
}
In this state, if I send event-generating data through postman, sse open appears on the console.
However, the result of the event is not displayed.
If I directly access /itf/subscribe through the url, the result of the event is displayed on the screen. However, I am not receiving the result of the event through event.onmessage.
What I want is to raise an event, and then receive the result of the event through the onmessage function.
I am wondering how can I get the result of the event.
best regards
how cached external javascript files helps HTML page to load fast?
I am little confused on how cached external javascript file linked to HTML page helps HTML page to load fast? Shouldn't the internal javascript file makes the HTML file load faster than external javascript file?
mercredi 27 octobre 2021
How do I use For Loop in JavaScript to show the list?
I am a beginner in JavaScript and I can't figure out the following problem: I am trying to create a simple JavaScript Movie List. I have 10 lists on the Movie List. I tried to show all of the lists with for loop, but it doesn't work. Here's the code:
function renderModal() {
for (let i = 0; i < listMovies.length; i++) {
let movieData = listMovies[i];
document.getElementById("poster").src = movieData.img;
document.getElementById("title").innerHTML = movieData.name;
document.getElementById("genre").innerHTML = movieData.genre;
document.getElementById("rating-num").innerHTML = "Rating: "+ movieData.rating + "/10";
document.getElementById("movie-desc").innerHTML = movieData.desc;
document.getElementById("imdb-page").href = movieData.link;
return movieData;
}
}
What do I have to do? Help me to fix it!.
How to display events on disabled dates in Fullcalendar?
I'm using Fullcalendar for displaying event booking. I disabled all previous dates to avoid new booking on old dates. But unfortunately, the previous events are not showing on the disabled dates. What I want to achieve is that show all the events irrespective of previous or upcoming, but disable the click option on previous dates to avoid adding events on old dates.
o.$calendarObj = o.$calendar.fullCalendar({
slotDuration: "00:15:00",
minTime: "08:00:00",
maxTime: "19:00:00",
defaultView: "month",
handleWindowResize: !0,
height: e(window).height() - 100,
header: {
left: "prev,next today",
center: "title",
right: "month,agendaWeek,agendaDay"
},
events: event_list,
editable: 0,
droppable: 0,
eventLimit: !0,
validRange: {
start: new Date(e.now())
},
selectable: !0,
eventClick: function(e, t, n) {
o.onEventDetailsClick(e, t, n)
},
dayClick: function(date, jsEvent, view, resourceObj) {
alert('Add New Event' );
}
})
Flutter Web: Login status and router settings in Firebase Multisite
Flutter Web: firebase google login
Login status and router settings in Firebase Multisite. login.abc.com and account.abc.com use the same resource. When you log in to login.abc.com, you are taken to account.abc.com, and when you log out of account.abc.com, you are taken to login.abc.com and the status is switched to Logout. How do I implement it in flutter web?
ex:> I want to implement it like https://www.squarespace.com/.
Any method to extract colors of background and foreground of a webpage by web scraping?
I want to extract the colors of the background and foreground of a given webpage . Are there any web scraping techniques related to it? I want to calculate the color contrast ratio of the web page.
why we use attrs in Beautiful Soup for scraping
for link in soup.find_all(attrs={'class': 'title"'}): for links in link.find_all('a'): If if i use attrs then links are scraped but if i use td then not scraped so whats the reason whats difference between attrs and tag
urllib sometimes doesn't open websites
I have a problem I can't really fathom... Sometimes I provide a Python app with a link to a txt web page and the app processes it as expected but sometimes I simply get errors, although the links seem basically identical (meaning they're both simple text-based web pages).
For example, I have a simple code like this:
import urllib.request, urllib.parse, urllib.error
link = input("Link: ")
fhand = urllib.request.urlopen(link)
for line in fhand:
print(line.decode())
When I type http://data.pr4e.org/romeo-full.txt as a link, it works. But when I type https://www.py4e.com/code3/romeo.txt, it doesn't. How come?
The errors I get:
Traceback (most recent call last):
File "C:\Users\lukas\AppData\Roaming\JetBrains\PyCharmCE2021.2\scratches\scratch_11.py", line 7, in <module>
fhand = urllib.request.urlopen(link)
File "C:\Users\lukas\AppData\Local\Programs\Python\Python39\lib\urllib\request.py", line 214, in urlopen
return opener.open(url, data, timeout)
File "C:\Users\lukas\AppData\Local\Programs\Python\Python39\lib\urllib\request.py", line 523, in open
response = meth(req, response)
File "C:\Users\lukas\AppData\Local\Programs\Python\Python39\lib\urllib\request.py", line 632, in http_response
response = self.parent.error(
File "C:\Users\lukas\AppData\Local\Programs\Python\Python39\lib\urllib\request.py", line 561, in error
return self._call_chain(*args)
File "C:\Users\lukas\AppData\Local\Programs\Python\Python39\lib\urllib\request.py", line 494, in _call_chain
result = func(*args)
File "C:\Users\lukas\AppData\Local\Programs\Python\Python39\lib\urllib\request.py", line 641, in http_error_default
raise HTTPError(req.full_url, code, msg, hdrs, fp)
urllib.error.HTTPError: HTTP Error 403: Forbidden
how to change div border-color by input value?
How to change div border-color by input value?
My Code
function myFunction() {
var color = document.getElemntByID("inpx").value; document.getElementById("divx").style.borderColor = color;
}<!DOCTYPE html>
<html>
<head> </head>
<body>
<div id=divx"> </div>
<button onClick=""> </button>
<script>
</script>
</body>
</html>What are the best resources for learning web software architecture?
I have four years of experience in software engineering, and now I am close to finishing my degree in Computer Science.
My main passion is software architecture in web applications, and I will be glad to get guidance from top resources to learn web software architecture.
I prefer reading books or watching videos from my TV on reading on online web blogs or the internet.
I appreciate any help you can provide.
Is there a website builder component can I inject in my application
Is there a website builder component can I inject in my application instead of develop new website builder?
Warn web user if the back button was pressed using javascript
Hi I tried to use the following javascript to warn users.
window.onbeforeunload = function() {
return "Are you sure you wish to leave?";
};
But I need to make sure that the back button is pressed it seems to call this when you change the url.
Thanks
Why is countryflags.io website and API down? Alternatives? [closed]
I am trying to access to https://www.countryflags.io website and use its API and I am getting an Error 522.
Does anyone has any information about it and/or knows any alternative to it?
Thanks in advance, Danny
I want different text in the same line positioned to the left and right inside a table cell
I am making a school timetable mock in HTML and CSS and I am having troubles with one specific thing and that is having 2 different pieces of text in the same line one positioned to the top left and the other to the top right. I have tried using float but that makes the text move down to text that is under it.
Here is the code used: https://jsfiddle.net/zhu2a1y4/
Here is the HTML code:
<table class="separated">
<tr>
<td>
<div class='cell_header'>
<p class="group">s1</p>
<p class="classroom">N228</p>
<div>
<h3>S: ICT</h3>
<p>KOH</p>
</td>
</tr>
<tr>
<td>
<p>s1 N228</p>
<h3>L: ICT</h3>
<p>KOH</p>
</td>
</tr>
</table>
And here is the CSS:
*{
padding: 0px;
}
table, td {
border: solid black 1px;
border-collapse: collapse;
text-align: center;
column-width: 200px;
height: 100%;
}
.separated td, .separated{
border: 0px;
border-bottom: 1px solid black;
height: 100%;
}
.cell_header p {
display: inline;
position: relative;
overflow: auto;
margin-top: 0;
}
.classroom{
text-align: right;
float: right;
}
.group{
text-align: left;
float: left;}
As you can see in the example the text "s1" and "N228" are Next to "S:ICT" and my objective is to have both of the pieces of text higher up in the corners.
Any help would be much appreciated.
Thank you in advance and best regards
Davza
How to update "static_path" and "xstatic_url" on the fly in tornado?
I'm new to Tornado, and trying to understand how can i update the static_path on the fly. (The Xstatic will be similar i guess)
For example:
Application([
('/static1/(.*)', tornado.web.StaticFileHandler, dict(path='static1')),
('/static2/(.*)', tornado.web.StaticFileHandler, dict(path='static2')),
])
I want to be able to update the path on the fly, inside the implementation of one of those Handlers.
Is that even possible? I know there are tools like static_url_prefix and update the static_path via settings of tornado. But can i do it on the fly? during execution of one the Handlers.
My usecase: Why do i need it?
When i am connecting via proxy server to load the web page of the application, there is a header of "/proxy/aHR0cHM6Ly8xMC4xLjMuMTAwOjQ0Mw==/" added to the URL in the browser, so it probably changes the relative path and i need to adjust the location of the static sources accordingly. (currently the html page cannot find the static sources when proxy used)
The problem:
I cannot know if there is a proxy or not,when tornado is first loaded. I know that only later when one of the handlers catches the regex url.
Maybe i can somehow concatenate the proxy header to the static_urlparameter?
Thanks.
Does it make sense to use django and npm in the same project?
I'm learning Django, I'm using Bootstrap etc. but I want to more customize for my website which build is bootstrap. I keep search and I saw that, if I want to customize bootstrap I should use bootstap-sass downloaded with npm.
Well, my question is "Does it make sense to use django and npm in the same project?" or "Should I use a different method?"
How to create a server using angular.min.js? [closed]
I'm trying to create an application by importing the angular.min.js file in html. I know how to create a server when I install angular the normal way using npm but in this case, I must import angular using the angular.min.js file. I am able to add it as a script in an html file. I can open the html file if I wanted to run that. Is there any way to deploy it on my localserver?
mardi 26 octobre 2021
How do I remove this graphical error for this button?
I am new to web development and I have a bug that I cannot seem to fix. Basically, I have a button that highlights when its hovered and it works but there is a small outline of the original color when hovered. I'm pretty sure this is not because of an outline or a border. The bug is displayed in the picture provided. Here is the code:
body {
background-color: #2d2f31;
}
.start{
width: 200px;
height: 75px;
border: none;
color:black;
background-color: beige;
border-radius: 50px;
box-shadow: inset 0 0 0 0 rgb(36, 36, 37);
font-size: 15px;
outline: 0;
transition: 0.5s cubic-bezier(0.165, 0.84, 0.44, 1);
cursor: pointer;
}
.start:hover{
box-shadow: inset 200px 0 0 0 rgb(36, 36, 37);
color: white;
}<div class=buttondiv>
<button onclick="coming('maintext', '#F0F');" class='start' >button</button>
</div>
How to implement apple login on flutter web?
I want to implement apple login on flutter web project. The below package not supporting web, Anyone know how to implement the same on flutter web ?
https://pub.dev/packages/sign_in_with_apple
JS return structure
What is the difference between {} and ( ) in JavaScript's return statement?
const fruits = [
{
name: "FaceBook",
nickname: "FB",
},
{
name: "Youtube",
nickname: "YT",
},
{
name: "AmazonWebService",
nickname: "AWS",
},
];
const count = fruits.reduce((acc, cur) => {
return { ...acc, [cur.nickname]: cur.name }; // What does {} of return mean here?
}, {});
I'm having some problem in focusing buttons
I'm having some problem with some button focus effects, although, I don't know if I'm supposed to use focus or not. So yesterday, I was trying to make a coffee roasters website. Now I have to create some options eg. What type of coffee the user wants and how much etc. So for that. I made h1s and below that I made some buttons. If they click on a button, It should change it's appearance so that the user knows it's selected now, when I am clicking on another button from another category, the previous category button is getting deselected because I used focus.I want all my categories to have different options and that the user can select any one option from a particular category but in terms of categories they can select a button from each category without deselecting the previous button from the previous category. I hope I didn't complicate the question but how can I do that? Please help me somebody!
TypeError: Cannot read properties of undefined (reading 'app') {Flutter web app}
I tried to connect my web app to firestore and try to run my web app but I can't. Please help me to solve my problem and grow my start-up faster. This is the error Showing error like this: TypeError: Cannot read properties of undefined (reading 'app')
How can I fix this problem?
**
My Flutter (index.html) code blew.
**
<!DOCTYPE html>
<html>
<head>
<!--
If you are serving your web app in a path other than the root, change the
href value below to reflect the base path you are serving from.
The path provided below has to start and end with a slash "/" in order for
it to work correctly.
For more details:
* https://developer.mozilla.org/en-US/docs/Web/HTML/Element/base
This is a placeholder for base href that will be replaced by the value of
the `--base-href` argument provided to `flutter build`.
-->
<base href="$FLUTTER_BASE_HREF">
<meta charset="UTF-8">
<meta content="IE=Edge" http-equiv="X-UA-Compatible">
<meta name="description" content="A new Flutter project.">
<!-- iOS meta tags & icons -->
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="apple-mobile-web-app-title" content="jaitun_admin">
<link rel="apple-touch-icon" href="icons/Icon-192.png">
<title>jaitun_admin</title>
<link rel="manifest" href="manifest.json">
</head>
<body>
<!-- This script installs service_worker.js to provide PWA functionality to
application. For more information, see:
https://developers.google.com/web/fundamentals/primers/service-workers -->
<script src="https://www.gstatic.com/firebasejs/9.0.1/firebase-app.js"></script>
<script src="https://www.gstatic.com/firebasejs/9.0.1/firebase-analytics.js"></script>
<script src="https://www.gstatic.com/firebasejs/9.0.1/firebase-firestore.js"></script>
<script src="https://www.gstatic.com/firebasejs/9.0.1/firebase-auth.js"></script>
<script>
const firebaseConfig = {
apiKey: "AIzaSyDmv2oj8958mbUg07FW316IxOAiOdYhPTg",
authDomain: "jaituncustomaer.firebaseapp.com",
databaseURL: "https://jaituncustomaer-default-rtdb.firebaseio.com",
projectId: "jaituncustomaer",
storageBucket: "jaituncustomaer.appspot.com",
messagingSenderId: "771594380318",
appId: "1:771594380318:web:aa0a3b61483d19dc2bfa0f",
measurementId: "G-B064R6Q9GJ"
};
// Initialize Firebase
const app = initializeApp(firebaseConfig);
const analytics = getAnalytics(app);
</script>
<script>
var serviceWorkerVersion = null;
var scriptLoaded = false;
function loadMainDartJs() {
if (scriptLoaded) {
return;
}
scriptLoaded = true;
var scriptTag = document.createElement('script');
scriptTag.src = 'main.dart.js';
scriptTag.type = 'application/javascript';
document.body.append(scriptTag);
}
if ('serviceWorker' in navigator) {
// Service workers are supported. Use them.
window.addEventListener('load', function () {
// Wait for registration to finish before dropping the <script> tag.
// Otherwise, the browser will load the script multiple times,
// potentially different versions.
var serviceWorkerUrl = 'flutter_service_worker.js?v=' + serviceWorkerVersion;
navigator.serviceWorker.register(serviceWorkerUrl)
.then((reg) => {
function waitForActivation(serviceWorker) {
serviceWorker.addEventListener('statechange', () => {
if (serviceWorker.state == 'activated') {
console.log('Installed new service worker.');
loadMainDartJs();
}
});
}
if (!reg.active && (reg.installing || reg.waiting)) {
// No active web worker and we have installed or are installing
// one for the first time. Simply wait for it to activate.
waitForActivation(reg.installing || reg.waiting);
} else if (!reg.active.scriptURL.endsWith(serviceWorkerVersion)) {
// When the app updates the serviceWorkerVersion changes, so we
// need to ask the service worker to update.
console.log('New service worker available.');
reg.update();
waitForActivation(reg.installing);
} else {
// Existing service worker is still good.
console.log('Loading app from service worker.');
loadMainDartJs();
}
});
// If service worker doesn't succeed in a reasonable amount of time,
// fallback to plaint <script> tag.
setTimeout(() => {
if (!scriptLoaded) {
console.warn(
'Failed to load app from service worker. Falling back to plain <script> tag.',
);
loadMainDartJs();
}
}, 4000);
});
} else {
// Service workers not supported. Just drop the <script> tag.
loadMainDartJs();
}
</script>
</body>
</html>
Trying to find a website where you can create a message that will not show until a specific date
does anyone know of the website where you can create a message on the website, and then share the link. The twist is that the message will not show until the date and time you have set when creating the original message.
Do I have to continuously repeat certain elements for them to appear on all documents [I'm fairly new]
So basically, I have a generic top navigation bar that shows where you can go.
ex. Top left = "Title" -some space between it- Other Site
Is it possible for me to type the top nav code in one area for it to forever stay in that area. I have opened up a couple of new documents so it's getting pretty repetitive at this point.
In summary, is there a feature/special thing I can do or do I just have to suck it up and continue the way I'm doing it?
Problem with ListView that located over Google map in Flutter web
I'm trying to implement page with Google map and i put ListView over this map. When i scroll this vertical ListView, map is actually scrolls too. Is there any way to prevent this behaviour and scroll map only when cursor located out of listview boundaries? Thanks[![Scroll conflict behind listview and google map][1]][1]
/// Layout that describes part with ListView
Positioned.fill(
child: Align(
alignment: Alignment.bottomRight,
child: sessions.maybeWhen(
orElse: () => const SizedBox.shrink(),
data: (items) {
return ConstrainedBox(
constraints: BoxConstraints(
maxHeight: items.length <= 3
? items.length * 130
: mediaQuery.size.width < 720 ? 150 : mediaQuery.size.height * 0.7,
),
child: ScrollablePositionedList.separated(
itemScrollController: controller,
scrollDirection: mediaQuery.size.width < 720
? Axis.horizontal
: Axis.vertical,
padding: EdgeInsets.all(mediaQuery.size.width < 720 ? 5 : 20.0),
itemCount: items.length,
separatorBuilder: (_, __) => mediaQuery.size.width < 720
? const SizedBox(width: 6.0)
: const SizedBox(height: 6.0),
itemBuilder: (_, i) {
return AdaptiveLayout(
smallLayout: Align(
alignment: Alignment.bottomCenter,
child: SizedBox(
width: mediaQuery.size.width - 32,
height: 100.0,
child: SessionCard(
session: items[i],
selected: selected == items[i],
onPressed: () {
if (selected == items[i]) {
onSelected?.call(null, null);
} else {
onSelected?.call(items[i], i);
}
},
),
),
),
largeLayout: FractionallySizedBox(
widthFactor: 0.4,
alignment: Alignment.bottomRight,
child: SessionCard(
session: items[i],
selected: selected == items[i],
onPressed: () {
if (selected == items[i]) {
onSelected?.call(null, null);
} else {
onSelected?.call(items[i], i);
}
},
),
),
);
},
),
);
},
),
),
);
///Part with Stack that contains map and ListView
AdaptiveLayout(
smallLayout: Scaffold(
body: Stack(
children: [
MapWidget(
onMapCreated: onMapCreated,
onMarkerSelected: onSessionSelected,
),
// const SearchBar(),
MapToolbar(
controller: mapController.value,
handlePermission: () async {
final provider = ref.read(positionProvider.notifier);
if (await (provider.handlePermission(context))) {
provider.getCurrentLocation();
}
},
),
ValueListenableBuilder<dynamic>(
valueListenable: selectedSession, /// Contains ListView
builder: (_, value, __) {
return SessionCards(
onSelected: onSessionSelected,
selected: value,
controller: scrollController.value,
);
},
),
ValueListenableBuilder<bool>(
valueListenable: showLoading,
builder: (_, value, __) {
return LoadingOverlay(
showing: value,
);
},
),
],
),
),
Exclude widget from scrolling in flutter
I was looking for design inspiration for my website and came across a very interesting design, this one (in web view).
What intrigued me, was how the brand name text (DYNAMIC STUDIOS) kept its static position, while the rest of the "widgets" -both in front and behind the text- were included in the scrolling.
My question is: how could we implement this feature with Flutter?
If we only had items in front or behind the Text, then with a simple Stack and SingleChildScrollView that could have easily been done. But how can you "Stack" an item in between "a scroll view"?
Showcased Website was found from the article 12 unique examples of photography portfolio websites.
Where can I set the "Cache-Control" or "ETag" headers for my website?
My website has a cache problem where my ETag's aren't getting generated correctly when a change is made to my website.
I've searched all over the internet, and there are tons of resources explaining WHAT the "ETag" header is for, but there's almost nothing explaining WHERE to set it.
Is there some configuration file I put it in? Some articles mentioned setting ETag generation rules in the .htaccess file, but isn't that just for Apache servers?
Any help is appreciated.
My web app is built with webpack, contained with Docker, and hosted with Kubernetes (using an nginx ingress server).
Changing pages disables navbar menu on Ruby on Rails
I have this problem. When the screen width goes below 1024px, the navbar changes to a responsive navbar that activates when a burger menu is clicked, this is made using javascript (it is being correctly compiled, the file is imported in application.js). This functionality works fine, but when I change pages (from home to store for example) it stops working, and I can't find the reason. Here's the code:
/* Javascript file */
document.addEventListener('DOMContentLoaded', () => {
let responsiveMenu = document.querySelector('.responsive-navbar');
let body = document.querySelector('body');
let burgerBtn = document.querySelector('.burger-menu');
let responsiveLinks = document.querySelectorAll('.responsive-menu-links')
burgerBtn.addEventListener('click', () => {
burgerBtn.classList.toggle('cross')
responsiveMenu.classList.toggle('menu-open');
body.classList.toggle('disable-scroll');
responsiveLinks.forEach(link => {
link.classList.toggle('trigger-anim')
})
})
})
/* _navbar.html.erb partial */
<div class="navbar-header">
<div class="navbar-menu">
<%=link_to 'Inicio', root_path%>
<a href="">ustedes</a>
<a href="">contacto</a>
<a href="">sobre mi</a>
<%=link_to 'Tienda', store_path%>
</div>
<div class="burger-menu">
<span></span>
<span></span>
<span></span>
</div>
<div class="responsive-navbar">
<div class="menu-background"></div>
<div class="menu-links">
<%=link_to 'Inicio', root_path, class: 'responsive-menu-links'%>
<a href="" class="responsive-menu-links">ustedes</a>
<a href="" class="responsive-menu-links">contacto</a>
<a href="" class="responsive-menu-links">sobre mi</a>
<%=link_to 'Tienda', store_path, class: 'responsive-menu-links'%>
</div>
</div>
<div class="navbar-items">
<div class="logo">
</div>
</div>
</div>
/* styles */
.trigger-anim {
animation: scaleIn .2s forwards;
}
.menu-open {
width: 100vw !important;
a {
opacity: 1 !important;
}
}
.disable-scroll {
overflow: hidden;
.home-container {
height: 100vh !important;
overflow: hidden !important;
}
}
.cross {
span {
&:nth-of-type(1) {
transform: rotate(40deg) translateY(20px);
}
&:nth-of-type(2) {
transform: translateX(500px);
opacity: 0;
}
&:nth-of-type(3) {
transform: rotate(-40deg) translateY(-20px);
}
}
}
What's the key code of the magnifying button on Android phones?
I'm trying to handle the key press event of the magnifying icon. It seems to be like "Enter" and "NumbpadEnter" key code isn't working for that highlighted icon in the screenshot.
FileReader. readAsArrayBuffer(fileObject) for getting binary form of image
I'm trying to upload an image from the front end and send it to the API in binary format(only binary is accepted by API). But when I try to send the binary form, the file is uploaded but is corrupted and the image size in the server is always 2B instead of the original size. Below is my code:
<input type="file" accept="image/*" @change="handleImage" />
<button @click="submit()">Submit</button>
function handleImage(e) {
const selectedImage = e.target.files[0]
createBase64Image(selectedImage)
},
function createBase64Image(fileObject) {
const reader = new FileReader()
reader.onload = (e) => {
const binaryImage = e.target.result
}
reader.readAsArrayBuffer(fileObject)
}
The binaryImage will hold the raw binary data from the file and upon submit, I'm sending this binaryImage to the API. Please let me know if anyone experienced a similar issue and got this fixed.
Thanks
Implementing a RESTful login for a website
I've been reading a lot of threads about how to properly implement a RESTful login but I am not fully convinced yet, so far this is what i've come up with:
- Fill username and password in my login form
- When the user hits the login button, build an authorization basic header with username + password
- Hit an endpoint (e.g /token, i guess this should be a GET?)
- Generate the JWT token and send it back to the client (if it's a GET, i guess it will go as a json body)
- Client then uses localStorage or whatever to save the token and then hit the authenticated endpoints by building the bearer header
Would this be considered fully restful? If so, which http method would you use for retrieving the token? If it isn't, what would be the best way of achieving this (using JWT)
How to connect my android application to my website cpanel backend
I want to link my android app to my websites cpanel to store and edit information. I wanna be able to use my own website as a backend instead of firebase. Any tips on where to start?
TypeError: Cannot read properties of undefined (reading 'app') (Flutter web app)
For more than 3 days I tried to connect my web app to firestore and try to run my web app but i can't. Please help me to solve my problem and grow my start-up faster. Showing error like this: TypeError: Cannot read properties of undefined (reading 'app') How can I fix this problem?
My Flutter (index.html) code blew.
<!DOCTYPE html>
<html>
<head>
<!--
If you are serving your web app in a path other than the root, change the
href value below to reflect the base path you are serving from.
The path provided below has to start and end with a slash "/" in order for
it to work correctly.
For more details:
* https://developer.mozilla.org/en-US/docs/Web/HTML/Element/base
This is a placeholder for base href that will be replaced by the value of
the `--base-href` argument provided to `flutter build`.
-->
<base href="$FLUTTER_BASE_HREF">
<meta charset="UTF-8">
<meta content="IE=Edge" http-equiv="X-UA-Compatible">
<meta name="description" content="A new Flutter project.">
<!-- iOS meta tags & icons -->
<meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black">
<meta name="apple-mobile-web-app-title" content="jaitun_admin">
<link rel="apple-touch-icon" href="icons/Icon-192.png">
<title>jaitun_admin</title>
<link rel="manifest" href="manifest.json">
</head>
<body>
<!-- This script installs service_worker.js to provide PWA functionality to
application. For more information, see:
https://developers.google.com/web/fundamentals/primers/service-workers -->
<script src="https://www.gstatic.com/firebasejs/9.0.1/firebase-app.js"></script>
<script src="https://www.gstatic.com/firebasejs/9.0.1/firebase-analytics.js"></script>
<script src="https://www.gstatic.com/firebasejs/9.0.1/firebase-firestore.js"></script>
<script src="https://www.gstatic.com/firebasejs/9.0.1/firebase-auth.js"></script>
<script>
const firebaseConfig = {
apiKey: "AIzaSyDmv2oj8958mbUg07FW316IxOAiOdYhPTg",
authDomain: "jaituncustomaer.firebaseapp.com",
databaseURL: "https://jaituncustomaer-default-rtdb.firebaseio.com",
projectId: "jaituncustomaer",
storageBucket: "jaituncustomaer.appspot.com",
messagingSenderId: "771594380318",
appId: "1:771594380318:web:aa0a3b61483d19dc2bfa0f",
measurementId: "G-B064R6Q9GJ"
};
// Initialize Firebase
const app = initializeApp(firebaseConfig);
const analytics = getAnalytics(app);
</script>
<script>
var serviceWorkerVersion = null;
var scriptLoaded = false;
function loadMainDartJs() {
if (scriptLoaded) {
return;
}
scriptLoaded = true;
var scriptTag = document.createElement('script');
scriptTag.src = 'main.dart.js';
scriptTag.type = 'application/javascript';
document.body.append(scriptTag);
}
if ('serviceWorker' in navigator) {
// Service workers are supported. Use them.
window.addEventListener('load', function () {
// Wait for registration to finish before dropping the <script> tag.
// Otherwise, the browser will load the script multiple times,
// potentially different versions.
var serviceWorkerUrl = 'flutter_service_worker.js?v=' + serviceWorkerVersion;
navigator.serviceWorker.register(serviceWorkerUrl)
.then((reg) => {
function waitForActivation(serviceWorker) {
serviceWorker.addEventListener('statechange', () => {
if (serviceWorker.state == 'activated') {
console.log('Installed new service worker.');
loadMainDartJs();
}
});
}
if (!reg.active && (reg.installing || reg.waiting)) {
// No active web worker and we have installed or are installing
// one for the first time. Simply wait for it to activate.
waitForActivation(reg.installing || reg.waiting);
} else if (!reg.active.scriptURL.endsWith(serviceWorkerVersion)) {
// When the app updates the serviceWorkerVersion changes, so we
// need to ask the service worker to update.
console.log('New service worker available.');
reg.update();
waitForActivation(reg.installing);
} else {
// Existing service worker is still good.
console.log('Loading app from service worker.');
loadMainDartJs();
}
});
// If service worker doesn't succeed in a reasonable amount of time,
// fallback to plaint <script> tag.
setTimeout(() => {
if (!scriptLoaded) {
console.warn(
'Failed to load app from service worker. Falling back to plain <script> tag.',
);
loadMainDartJs();
}
}, 4000);
});
} else {
// Service workers not supported. Just drop the <script> tag.
loadMainDartJs();
}
</script>
</body>
</html>
Inscription à :
Articles (Atom)