+ JavaScript の質問用スレッド vol.121 +
■ このスレッドは過去ログ倉庫に格納されています
JavaScript に関する何でも質問スレです。
お気軽にどうぞ。 今javascriptとnode.jsを勉強してるんですがこの2つだけじゃ身につけにくいプログラミング言語の特徴みたいなのありますか?
型とかポインタ?とかかなと思うんですが 古すぎるスレを再利用するな無能
昔は賑わってたから分散を防ぐために1つ1つ潰していく必要があったし
それが美学だったが、もう死んでるスレを掘り起こす意味は無いだろ
さっさと新しく作れ >>646
別に死んでないよ
君はこのスレが使われると何か都合が悪いの? 立てるべきと思うなら立てりゃいい
前スレも再利用だしなんで今更言い出すのか知らんけど 馬鹿か
1つ、2つ前のスレならまだしも
2014年に建てられたスレをわざわざ掘り起こして再利用するヤツが居るかよ
テンプレだって腐ってんじゃねーか
ここに初めて質問した人にテンプレをまず確認しろという
超超超基本的なことも言えないだろ
下痢カス野郎 いや立てりゃいいじゃん
前スレ1000行く前に立てりゃ良かったのに 天才か
そりゃお前の言う通りだよ
オマケに次スレに案内したというところは超評価してるんだよ
でも案内先が地獄じゃねーかって文句一点だろ
いい加減理解しろよトンカチ頭 いやここで愚痴る間に立てりゃいいじゃん
誰も禁止してない NO
俺は建てない
お前は国に不満があったら国を作るのか?
この親不孝者め! Chromeブラウザの機能拡張についてはここで大丈夫でしょうか
自作の機能拡張を作りました。
ローカルから機能拡張をあててローカルに保存されたhtmlに対してだとエラーがでないのですが
ストアに登録して機能拡張あててローカルに保存されたhtmlだとエラーがでます。
manifestは
"permissions": [
"activeTab",
],
です。これだけだと足りないみたいなので"file://*/"を足そうと思うのですが
この対策で妥当ですか?
エラーは
lastError: Cannot access contents of the page. Extension manifest must request permission to access the respective host.
です
よろしくお願いします 自己解決
"file://*/"の追加はいらない。機能拡張の設定からファイルへのアクセスを許可をONにするでいけました。
ローカルでの機能拡張の場合はデフォルトでONになってる。 jsで配列等の初期値は未定義ですか?
配列作成後、各要素にどのような値が入っているか仕様上の保証はありますか? JSで初期値があるのは宣言された変数のみ
たとえ長さ100のArrayを作ったところで
実際に空の箱が100個用意されるという仕様はない
ただlengthが100に設定された配列オブジェクトができるだけ
それぞれの要素に初期値などは設定されない
オブジェクトの未定義のプロパティにアクセスするとundefinedが帰るという仕様はある
ただしそれはundefinedが入っていることとはベつ 簡単なアプリを作ったんですがiphoneのみ画像やアイコンが表示されません
windowsやlinuxの色々なブラウザでは問題無しです
よくある原因は何になりますか? iPhoneのSafariはmanifest.jsonまだ対応してないの?(クソデカため息)
>>659
これ使え
https://github.com/GoogleChromeLabs/pwacompat 【環境】Firefox 89.0.2, Chrome 91.0.4472.114
【何をしたのか】具材の一部を選択した後、フォームをリセットする
【エラーメッセージ】なし(input.curryのindeterminateプロパティがtrueのままになる)
【期待する結果】全てのチェックボックスのcheckedプロパティとindeterminateプロパティがfalseになる
【サンプルコード】https://jsfiddle.net/rhyutmL8/ リセットボタンクリック時に関数実行してクリアすればよくね? >>660
遅くなりましたがありがとうございます! >> 661
formのresetイベントでindeterminateをfalseにすればええんちゃう 既出でしたらすみません。
slice()やcharAt()などの文字列メソッドの用途があまり想像できません…。
業務や趣味で使用したことある方いましたらどのように使用したのか教えていただけますでしょうか。 料金シミュレーションができるサイトで、
リストを選択すると金額がかわるものがあります。
ソースを見ると
<select name="item">
<option data-price="1000" value="1">商品名</option>
のような感じになっており、
選択するとJavascriptでdata-priceの値を取得して
金額を計算する形が多いのですが、
こういう仕組みってセキュリティ的に問題ないのでしょうか?
外部からの送信で金額が書き換わるとか・・・ >>670
安く買いたい人が金額を書き換えるとか、そういう問題起きないですかね?
フォームに金額を設定するタイプの仕様って危険な香りがして・・・ >>671
常識的には実際に登録する時にサーバはバリデートする
でないとクルーザー100円で買ったよ!なんて事になるから 自分が書き換えて、自分が見るだけなら、間違っても問題ない。
単に、その人の入力ミスだから
一方、サーバーのデータを書き換えて、大勢の人が見るなら、ヤバイ
サーバー側でもエラーチェックするけど、
例えば、千円を100円に間違ったため、多くの申し込みがあったとかは防げない
サーバー管理者にとって、100円がエラーとは分からないから よく起こるのは、通貨・株式取引で、1桁間違ったとか
こういうのは商取引でも、プロの取引に認定されているから、間違った人が悪い。
取引を錯誤などで、キャンセルできない。
取引が絶対に確定される
一方、一般消費者の取引では、錯誤でキャンセルできる。
一般消費者は取引のプロではないから >>671
フォームでsubmitされるのはvalue=“1”のほうであってdata-priceじゃない
確認画面では正しい金額で表示される
確認画面の金額もローカルで変更してから
OKボタンを押したところで支払う金額が変更後のものに変わるわけじゃない >>671
できるかどうかの前に
故意に書き換えて購入しようとしたら犯罪ちゃうの?という素朴な疑問 671です。実際に登録が完了する前にバリデーションしたら問題ない
ってのは分かった上で、表面上の金額が変わることに問題ないのか?
という疑問が起きました。
故意に変えたら犯罪ではありますが、
そういう仕様になっているのは設計する側のミスでもあるので。
とりあえず、「操作している人が金額を変えられたとしても
決済時に金額が代わらないなら問題ない」
という解釈をし、HTMLに金額を書いても問題ないと理解しておきます。 スーパーの値札なんて簡単に入替できるけど
店舗設計者のミスなの? カスタムデータ属性で何ができるのか調べればいいのに…
目の付け所が糞過ぎて凄い勉強効率悪そう HTMLに金額書かずにどうやって客に金額を提示するんだよw 書き換えられると困るので、このスーパーではレジのみにて金額の確認をさせていただいております
どうかよろしくご理解ください >>681
optionにはidだけ記載して、Ajaxで金額を称号して計算すると思ってました
でも、これならいちいちDBにアクセスするため、効率悪いですよね >>683
ajaxで金額を照合して計算したとしても
計算結果の金額をユーザーに提示する必要があるよね
それは何らかの形でHTMLに書かれるわけだから
data-priceに金額を書いてるのと同じで書き換えが可能 >>684
非同期通信のデータも書き換えることができるんですね
出来ないと思ってました。HTMLに書くわけではないですから。 もう何言ってるんだかって感じ・・・
とりあえずHTTPの基礎を学んで出直してくれ 非同期通信とかを知っていて、なんでそんな思考になるのか理解できない
どんな順番で学んだのかな? 逆です。「もし自分が知らなかったら大変なことになる」と思っての質問です。
完璧に全ての要件を理解しているわけではないので、
自分が知らないことでセキュリティリスクが発生してはいけないと思い、
イレギュラーな質問をした次第です。問題ないのならそれが一番です。 非同期通信のデータも書き換えることができるけど
そうじゃなくてサーバーから受け取ったデータを元にHTMLを更新しないとユーザーは金額見れないじゃん HTTP理解してない人間がWebアプリ開発に関わるというのが一番のリスク
Webアプリを開発するなら徳丸本レベルのセキュリティ知識は必須 CSRFトークンやらは流石にチームリーダーかベテランが設計して、レビューするのでは? CSRFトークンとかはフレームワークが用意してる仕組みを使えよ Ruby on Rails では最初から、
CSRF・Cross Site Request Forgeries 対策されている >>694
ルビ基地さん、マルチポストは禁止ですか? Web上で動く動画編集ソフトを作っていて、メモリの使用状況を知りたいのですが、
navigator.onmemorypressureがクソ使えません。
タブが落ちるまで発動しないことや、落ちる寸前で発動してどうしようもないときがしばしばあります。
今は代わりにWeakRefを使ってCGの粒度と頻度を監視してメモリの逼迫を予測しているのですが
いつまでも実装内部の微妙な振る舞いに頼った方法を使うわけにもいかないので
もっと良い解決方法はありませんでしょうか? 超初心者です。
今やっている教材で
if(!$('#text').val()){
といった条件式のif文が出てきたのですが
これはなにをもってtrueなのでしょうか……
textは文字を1行入力するinput要素につけられたidだと思います その要素のvalue属性がfalsyなら条件式がtrue
(!が否定なので)
文字列が空だったりしたらtrueになる まず、!$('#text').val()、これは、!( $('#text').val() ) と同じ。
.val() は、<input>の内容を取得するので、文字列型
!文字列型 は、文字列を否定した真偽値になる。
さらに、その真偽値を否定すると、!!文字列型。肯定に戻る
文字列の真偽値は、空文字列なら偽。
それ以外は真と判定される
だから下の出力は、文字列が存在すれば「あいう true false」、
空文字列なら「false true」
<label>入力文字列<input type="text" id="Text1" value="あいう" autofocus></label><br>
<button id="Button1">押して</button>
<p>出力 : </p><div id="output"></div>
$( "#Button1" ).click( function ( ) {
inputText = $( "#Text1" ).val( ) // 取得
console.log( inputText, !!inputText, !inputText )
$( "#output" ).text( `${ inputText } ${ !!inputText } ${ !inputText }` ); // 設定
} ) 下記のような処理を行いたいのですが、「httpresponseに反応し、関数を呼び出す」の実装方法がわかりません。何か方法はありませんでしょうか。初学者の質問で恐縮です。
ページを表示→入力フォームに文字列を入力後送信ボタンをクリック→関数が呼び出され、httpresponseを返す→httpresponseに反応し、関数を呼び出す jQuery on を使う。
よく知らないけど、素のJavaScript なら、addEventListener かな?
$('button').on('click', function(){
console.log('on');
});
Ajax 通信かな?
Promise, async/await とか
1. クライアント側から、サーバーへ送信する
2. サーバーで処理して、クライアントへ返信する
3. クライアントで受信して、処理する 昔は、Ajax に、jQuery を使っていたけど、
最近は、axios を使う
「ajax axios 違い」で検索して! 通信技術板なのかもしれないんだけど、サイト閲覧や掲示板利用でIMEIって抜かれる(抜ける)ものなのかな?
IMEIのチェックサイトでも自動取得ではなく入力しろとなっているから、特殊なアプリでもなければ無理だよな思うんだけど
JavaScriptでも端末情報の取得までがマックスだよね、ちょっと自信ないので教えてください
セキュリティ板でモバイル板行けと言われたんだけどモバイル板も板違いっぽくて、ここに辿り着きました ヘッダにつけて出して叩かれてたからdocomo以外は出さないと思ってたが、今はしらん
https://anond.hatelabo.jp/20111019232107
iphoneって付けるってホント? >>706
こんなのあったんだ、ありがとう
iPadのWiFi利用だからそこまでは分からないんだけど
ドコモのそれも勘弁してくれだなあw
こんな簡単に抜かれて偽装だのされたらかなわない >>705
「imei macアドレス 違い」で検索して
IMEI は知らないけど、
端末固有のMACアドレスなら、同一LAN 内で、端末を識別するために使うだけ。
LAN外のWAN・インターネットには、その情報を渡さない
もし外へも渡すのなら、それをユーザー自らが許可しないといけない UUIDが簡単に取れたのは昔々の話
iPhoneだとiOS6とかその時代 >>708-709
ありがとう、さらに調べてみました
やはり警戒したいのはIMEIなんだけどWEB経由では取得出来ず、
アプリなら技術的には取得可能ということのよう
もっともAppleもGoogleも基本的にはアプリでの取得も認めてない模様
現段階では、これで間違いないような気がする(素人判断) このような場合でccc関数でaaa()を呼ぶにはどうしたらいいんですか?
function main{
function aaa(){
}
function bbb(){
}
}
function ccc(){
//ここでaaa()を呼びたい
} 訂正:function mainではなくfunction main()です aaa を外出しにするか、main をインスタンスにしてaaaメソッドを呼ぶくらい
main内のスコープだよ内部変数と同じ ABEMAのサイトなんですが
その中で遷移する場合、普通に遷移するのではなく、
unloadせずにjsでいろいろして遷移しているように見えます。
(例えばhttps://abema.tv/now-on-air/news-plus から右のチャンネル一覧を出して別のチャンネルに移動する場合
Consoleにはリンク先URLに移動しました などのログがありませんがアドレスバーはちゃんとかわっています
戻るを右クリックして履歴を出してもちゃんと履歴はあります)
jsで読み込んでDOM操作すればページ自体は行けるのはわかるのですが
URLや履歴はなぜ遷移なしに変更できるかわかりません。
document.URLなどに移動先アドレスを代入すれば普通に遷移してしまうと思います。
これはどのようにして実現しているのでしょうか? chrome系の場合遷移したのにその前の履歴が残らないのはあまりよろしくないということで結構前のバージョンからreplaceStateでもpushStateと同じ動作なので注意 その理由はおかしくないか?
303とかと同じで戻られたらよろしくないこともあるでしょ サムネをクリックするとページ移動しないでその場で拡大画像を表示させるには
jqueryやライブラリ使わないで自力でjavascriptコード書くのは難しいですか?
そんなに手間かからないならjavascriptだとどう書けばいいんですか? absoluteなdivをオブジェクトとして作っておいて
imgにclickのaddEventListenerでdivオブジェクトの中のimgのsrcをclickもとのsrcから引っ張ってきて
bodyあたりにappendChildしたらいいんじゃないかな >>720
全然難しくない
そういう処理をしてるサイトでクリックイベントのコードを見れば解決 >>721
ajaxでデータ取ってくるイメージだと思うので
プログレスインジケーターとかもろもろの処理が普通は必要 例えば、jQuery のhover で、画像サイズを大きくするアニメなら、
<img src="a.jpg" id="img_01">
$( function ( ) {
$( "#img_01" ).hover ( function ( ) {
$( this ).stop( ).animate(
{ width: '600' }, 1000 );
}, ( function ( ) {
$( this ).stop( ).animate(
{ width: '300' }, 1000 );
} )
)
} ); 例えば、jQuery で、
ボタンをクリックすると、画像を追加する
<div id="div_1"></div>
<button id="btn_1">押して</button>
$( function ( ) {
$( '#btn_1' ).on( 'click', function( ) {
// 要素の下に、要素を追加する
$( "#div_1" ).after('<img src="b.jpg">');
} )
} ); >>725
サムネならワンチャン transform の scale でいけますか?
いけますんね… できなくはないだろうけどやる意味がない
サイズ云々じゃなくてクリック対象と拡大表示される画像はさすがに別のDOMじゃないとださい
画像自体はでかい画像のほうをcssで縮小してサムネにしておくとかなら同じオブジェクトのコピーでもいいけど Lazy Loadみたいにimgタグに属性として実寸画像データのアドレス入れておいて差し替えたらいいんじゃないの? Googleフォトに登録してAPIを使えばいい
サムネイルのサイズから拡大のエフェクトまで端末の種類に応じていい感じにしてくれる wakuの高さを取得したくてこれでやっても600にならずに1800と表示されてしまいます。
どうしてでしょうか?たぶんoverflowで隠れた画像の高さも含めてる?
どうすれば高さの600を取得できますか?
<style>
#waku{
width:90%;
height:600px;
overflow:hidden;
}
</style>
<div id="waku">
<ul>
<li><img src="test1.png"></li>
...
<li><img src="test5.png"></li>
</ul>
</div>
<スクリプト>
var element = document.getElementByID("waku");
var element_style = getComputedStyle(element);
var property_value = element_style.getPropertyValue("height");
property_value = parseInt(property_value);
alert(property_value);
</スクリプト> display:table-cellを消したらちゃんと取得できました element.onclick = func1;
func1(str){
alert(str);
}
この場合func1に引数を渡すにはどうすればいいんですか?
element.onclick = func1("aaa");ってやってもできなかった 部分適用
- 関数を返す関数に引数を渡す
- 返す関数は外側の関数の引数をキャプチャする(クロージャ)
function func1(str) {
return function(e) {
alert(str);
}
}
element.onclick = func1("aaa"); アロー関数使えばもう少し簡単に書ける
がCloudflareに弾かれたのでググってくれ ユーザーjsの使用用途で質問です。
webページで出てきたダイアログボックス(window.confirmで出力している様子)に対し
3秒後に自動で「OK」を押し(もしくはキーボードのEnter)てダイアログを閉じるにはどのように書いたら良いでしょうか・・?
使用環境
Chromeの拡張プラグインで「Tampermonkey」というユーザーjsのプラグインで使用
宜しくお願いします。 すいません用途や環境はあまり考えなくて大丈夫です。
普通にjsでダイアログを閉じる記述を教えてください。。 ■ このスレッドは過去ログ倉庫に格納されています